angular-cli: Invalid JSON character when running ng update @angular/cli
Versions
Angular CLI: 6.0.0
Node: 8.11.1
OS: win32 x64
Angular:
...
Package Version
------------------------------------------------------
@angular-devkit/architect 0.6.0
@angular-devkit/core 0.6.0
@angular-devkit/schematics 0.6.0
@schematics/angular 0.6.0
@schematics/update 0.6.0
rxjs 6.1.0
typescript 2.7.2
Repro steps
- npm install -g @angular/cli
- npm install @angular/cli@latest
- ng update @angular/cli
Observed behavior
Invalid JSON character: "" at 0:0.
Desired behavior
Configuration should be migrated to the new angular.json format. If there is a problem, an understandable error message should be shown.
Mention any other details that might be useful (optional)
.angular-cli.json
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"project": {
"name": "<removed>"
},
"apps": [
{
"root": "Client",
"outDir": "wwwroot",
"assets": [
"favicon.ico"
],
"index": "index.html",
"main": "main.ts",
"polyfills": "polyfills.ts",
"test": "test.ts",
"tsconfig": "tsconfig.app.json",
"testTsconfig": "tsconfig.spec.json",
"prefix": "<removed>",
"styles": [
"../node_modules/@clr/icons/clr-icons.min.css",
"../node_modules/@clr/ui/clr-ui.min.css",
"../node_modules/font-awesome/css/font-awesome.css",
"../node_modules/ng2-toastr/bundles/ng2-toastr.min.css",
"../node_modules/tether-drop/dist/css/drop-theme-arrows.css",
"../node_modules/tether-drop/dist/css/drop-theme-arrows-bounce.css",
"styles.scss"
],
"scripts": [
"../node_modules/@webcomponents/custom-elements/custom-elements.min.js",
"../node_modules/@clr/icons/clr-icons.min.js",
"../node_modules/tether/dist/js/tether.min.js",
"../node_modules/tether-drop/dist/js/drop.min.js"
],
"environmentSource": "environments/environment.ts",
"environments": {
"dev": "environments/environment.ts",
"prod": "environments/environment.prod.ts"
}
}
],
"e2e": {
"protractor": {
"config": "protractor.conf.js"
}
},
"lint": [
{
"files": "Client/**/*.ts",
"project": "tsconfig.app.json"
},
{
"files": "Client/**/*.ts",
"project": "tsconfig.spec.json"
},
{
"files": "Client/**/*.ts",
"project": "e2e/tsconfig.e2e.json"
}
],
"test": {
"karma": {
"config": "karma.conf.js"
}
},
"defaults": {
"styleExt": "scss",
"serve": {
"ssl": true,
"sslCert": "server.cert",
"sslKey": "server.key"
},
"component": {}
}
}
About this issue
- Original URL
- State: closed
- Created 6 years ago
- Reactions: 6
- Comments: 18
@YoannBureau @Swellenator I managed to get this fixed. I simply opened my .angular-cli.json file in notepad++ and clicked Convert to UTF-8 from the Encoding menu before saving the file. Running ng update @angular/cli now works as expected. There must have been a hidden BOM at the start of the file.
@martindevos I fixed the issue by converting some more .json files (tsconfig, etc.) to UTF8.
@cado1982
.angular-cli.json
was in UTF8, buttslint.json
was UTF8 with BOM - I made it UTF8 and can finally progress. The problem wastslint.json
.@cado1982’s answer worked for me!
My
.angular-cli.json
was open in VSCode as a “UTF8 with BOM” encoding, but changing to to be “UTF8” and then runningng update @angular/cli
finally worked and upgraded me as expected.For those not familiar, in VSCode on the bottom toolbar on the right is shows the file encoding. Click this to show a menu to change it.
It would however be nice when angular-cli shows the file with the JSON error 😃
I got the same error with ng g library. I didn’t had any encoding issues, however I had one excessive comma in tsconfig.json, which made it invalid json.
After converting all of my .json files to UTF8 (without BOM) as Tom suggested, it finally worked. Thanks alot !
I had the same issue Solved by removing comments from
tsconfig.json
I had the same as @FrankiePo , I just got a comma at the end of an object in tsconfig.json. I think you should check your tsconfig.json, with e.g. https://jsonlint.com/ . Good luck.