Not angular specific - general guidance needed
I have a 60k line json that holds key:value for localization of a huge website
example:
and there's a file for each language.
I created a c# script that scans each ts & html file in my project
if on ts there's a regex that matches for .translate("string"), that string key is kept
and if in html the key is used next to a pipe, that key is also kept
all other unused keys will be deleted
but since I am using regex there are so many edge cases that don't work, specially since there could be a lot of differences when it comes to stylers, whitespaces...etc
Any idea how to do something like this in the context of vscode or whatever context:
scan all the ts files and whenever there's a ts file that injects translationService & uses the translate() method, take the passed key and log it somewhere
or get all references to a method, and see what value is passed to it.
also scan all the html files and whenever there's usage of my translation pipe, check the passed value and log it somewhere
4 Replies
Just some ideas: The easiest approach would probably be a convention, eg. suffixing the translations with tl_ or something
Alternatively, the TS compiler or eslint api might be an interesting approach? But it feels overkill
This sounds like a convention based solution is quick to implement without a lot of overhead
@Sossenbinder
but how would I suffix all the keys throughout the project if I can't find them in the first place? 😄
Also I don't wanna do it manually, file is huge
and each key is used multiple times throughout the project
You want eslint to scan the syntax trees for method invocations
It shouldn't be hard to do
if your projecet has modules and you can split translations to put them in the modules then automatic tree shaking would remove most of the unutilized one