Jun 08, 2018

Excel and PowerShell to maintain your SPFx localized resources

Hi SharePoint devs,

Today, I want to share with you a technique I use everyday for the sake of productivity, make intensive use of Excel to maintain, generate, refactor code, scripts, ... With SPFx too, this technique happen to be useful for the localized resources, I thus come up with a small tool you might find useful to easily maintain them in your SharePoint Framework solutions.

The localized resources

You probably are already aware of this, SPFx natively supports localized resources. That allows you to easily handle translation of your user interface for instance. In your SharePoint solution, you fill find by default a folder named loc in the source folder of your WebPart or Extension.

loc-spfx

This folder contains by default a file name en-us.js that contains the locale-specific values, you can add a copy of this file, rename and update it accordingly for any of the locales you need to support. This file defines a module with, as content, a JSON object representing the resources key/value pairs. In that same folder, you file also find, by default, mystrings.d.ts. It is a typings file that will let you benefit of the intellisense and TypeScript code checking. That is really easy to use and pretty straightforward... at least it is with only a few resources...

Maintenance of a lot of resources

If you happen to have several dozens of strings to maintain, it could become pretty tedious to handle, and require to be really rigorous. Moreover, the people that will translate the UI are not always the developers themselves, and it can be less natural for them to do that in a JSON format.

Excel to the rescue

It would be much more natural to keep a big table with the resources and preferably with a familiar and powerful tool, what best candidate than Excel ?

Let's try it

I came up here with an Excel named localized-resources.xlsx workbook that will contain one sheet per locale, it could also have been one big spreadsheet with all the values in columns, but I prefer to separate them.

loc-excel.png

As you can see I have a simple table with keys and values, the sheet is copied and updated for all locales I want to support

Get the SPFx code files from Excel

You can then check this little PowerShell tool I created here. Make sure you have installed the prerequisite tool and then run the Update-SPFxLocalizedResources.ps1 PowerShell script and see the files being automatically generated. You can copy them in the loc folder of your solution and that's it. If the resources have to be updated later, or if a new locale must be supported, just update the Excel file accordingly and re run the PowerShell.

That's all folks

As always, I hope this tool will be useful, feel free to use it and adapt it to your needs!

looking forward to receive your feedback!

Cheers,

Yannick

Other posts