How to pass the JSON validation of write-manifest.json when adding "debugLocale"? - json

Question

I'm trying to build my first localised SPFX WebPart for Sharepoint Online. I've added an additional language de-de.js in the loc folder and now I'm trying to change the write-manifest.json to use my new language on debug by adding the `"debugLocale" property to it:
{
"$schema": "https://developer.microsoft.com/json-schemas/spfx-build/write-manifests.schema.json",
"cdnBasePath": "<!-- PATH TO CDN -->",
"debugLocale": "de-de"
}
Checking the official instructions of Microsoft and inspecting the JSON sheme of the write-manifest.json shows this should compile, but when I gulp serve it returns:
Build target: DEBUG
./node_modules/#microsoft/node-core-library/lib/JsonSchema.js:178
throw new Error(prefix + os.EOL +
^
Error: JSON validation failed:
./config/write-manifests.json
Error: #/ (Defines configuration options for the...)
Additional properties not allowed: debugLocale
at validateObjectWithCallback (./node_modules/#microsoft/node-core-library/lib/JsonSchema.js:178:19)
at JsonSchema.validateObjectWithCallback (./node_modules/#microsoft/node-core-library/lib/JsonSchema.js:193:13)
at JsonSchema.validateObject (./node_modules/#microsoft/node-core-library/lib/JsonSchema.js:175:14)
at WriteManifestsTask._readConfigFile (./node_modules/#microsoft/gulp-core-build/lib/tasks/GulpTask.js:311:28)
at WriteManifestsTask.onRegister (./node_modules/#microsoft/gulp-core-build/lib/tasks/GulpTask.js:87:32)
at Object.initialize (./node_modules/#microsoft/gulp-core-build/lib/index.js:299:24)
at SPWebBuildRig.initialize (./node_modules/#microsoft/sp-build-common/lib/BuildRig.js:61:19)
at SPWebBuildRig.initialize (./node_modules/#microsoft/sp-build-common/lib/SPBuildRig.js:29:15)
at SPWebBuildRig.initialize (./node_modules/#microsoft/sp-build-web/lib/SPWebBuildRig.js:15:15)
at Object.exports.initialize (./node_modules/#microsoft/sp-build-web/lib/index.js:23:17)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! hello-world#0.0.1 start: `gulp serve`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the hello-world#0.0.1 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! ~/.npm/_logs/2019-01-09T16_43_53_070Z-debug.log
How can I solve this issue?

Answer 1

Between 1.5 and 1.6, the build tasks appeared to have changed. I have confirmed the issue with 1.6+.
If you modify your write-manfiest.json "debugLocale" to "buildSingleLocale", everything will work as expected. I think the docs and the schema may be out of date.
{
"$schema": "https://developer.microsoft.com/json-schemas/spfx-build/write-manifests.schema.json",
"cdnBasePath": "<!-- PATH TO CDN -->",
"buildSingleLocale": "de-de"
}

Answer 2

I just tried that and it works in my setup.
Created webpart using yo #microsoft/sharepoint with default options (using React as Javascript framework)
Added de-de.js file to loc folder and changed values so I can see that is really grabs the correct file
Added "debugLocale": "de-de" to write-manifests.json
Run gulp serve
Texts used are from de-de.js
My versions:
yo - 2.0.3
#microsoft/sharepoint generator - 1.4.1 (I know it is old one)
npm - 5.6.0 (Yes, also old one)
But, once I update the #microsoft/sharepoint generator to latest version 1.7.1 it stopped working. It seems that the issue occurs since version 1.6.0
Workaround is to run it with --locale parameter like gulp serve --locale=de-de or to use older version:
npm uninstall #microsoft/generator-sharepoint -g
npm install #microsoft/generator-sharepoint#1.5.1 -g