Angular-cli: Error showed up while run the command `ng generate module about`

Created on 16 May 2018  Â·  15Comments  Â·  Source: angular/angular-cli

Versions

λ ng --version

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / â–³ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/


Angular CLI: 6.0.1
Node: 9.8.0
OS: win32 x64
Angular: 6.0.2
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.6.1
@angular-devkit/build-angular     0.6.1
@angular-devkit/build-optimizer   0.6.1
@angular-devkit/core              0.6.1
@angular-devkit/schematics        0.6.1
@angular/cli                      6.0.1
@ngtools/webpack                  6.0.1
@schematics/angular               0.6.1
@schematics/update                0.6.1
rxjs                              6.1.0
typescript                        2.7.2
webpack                           4.6.0

Repro steps

  • ng new nebular-demo
  • cd nebular-demo
  • ng serve
  • ng generate module about

Observed behavior

λ ng generate module about
Unexpected token ] in JSON at position 720

Same error when run command ng generate component about

What is happening?

schematicangular medium broken

Most helpful comment

I have found the problem. check the angular.json file.

"assets": [
              "src/favicon.ico",
              "src/assets",
            ],
            "styles": [
              "src/styles.css",
              "./node_modules/bootstrap/dist/css/bootstrap.css",
              "./node_modules/@nebular/theme/styles/prebuilt/default.css",
            ],

just remove the comma after "src/assets" and "...default.css"
like below:

"assets": [
              "src/favicon.ico",
              "src/assets"
            ],
            "styles": [
              "src/styles.css",
              "./node_modules/bootstrap/dist/css/bootstrap.css",
              "./node_modules/@nebular/theme/styles/prebuilt/default.css"
            ],

then will fix the problem.
Somehow if the comma is in js code it will work. But not here.

Thanks to @xlxAciDxlx !

All 15 comments

Perhaps an issue with the encoding of angular.json, it's just a guess based on other related issues.
Try converting your angular.json file to utf-8 without BOM and see if that helps.
And of course verify that angular.json contains only valid json :-)

Thanks for the reply! The encoding of angular.json is the utf-8 without BOM. And It is a valid json file. Actually I haven't done anything with the angular.json. It is just a new project generated using angular-cli.

I same problem

Angular CLI: 6.0.2
Node: 8.11.2
OS: linux x64
Angular: 6.0.2
... animations, cdk, cli, common, compiler, compiler-cli, core
... forms, http, language-service, material, platform-browser
... platform-browser-dynamic, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.6.1
@angular-devkit/build-angular     0.6.1
@angular-devkit/build-optimizer   0.6.1
@angular-devkit/core              0.6.1
@angular-devkit/schematics        0.6.2
@ngtools/webpack                  6.0.1
@schematics/angular               0.6.2
@schematics/update                0.6.2
rxjs                              6.1.0
typescript                        2.7.2
webpack                           4.6.0

display error
Unexpected token ] in JSON at position 1337

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / â–³ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/


Angular CLI: 6.0.3
Node: 9.10.0
OS: win32 x64
Angular: 6.0.2
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.6.3
@angular-devkit/build-angular     0.6.3
@angular-devkit/build-optimizer   0.6.3
@angular-devkit/core              0.6.3
@angular-devkit/schematics        0.6.3
@angular/cli                      6.0.3
@ngtools/webpack                  6.0.3
@schematics/angular               0.6.3
@schematics/update                0.6.3
rxjs                              6.1.0
typescript                        2.7.2
webpack                           4.8.3

Same thing here. I'd be able to fix it myself if it at least said what file the error was found in.. I've checked every JSON file I can find (including angular.json), and all of them are valid.

Calling: ng g c components/index
Error: Unexpected token } in JSON at position 1333

It looks like not just me had the problem, I think it may be an encoding problem, but not sure where it is.

It looks like not just me had the problem

When I searched for the issue (to see if it already existed), yours was the first of many that had come up.

but not sure where it is

Yeah, same issue here. Running a linter and tsc all work fine, it just seems to be generating things that's broken for me.

Alright, my issue's fixed. It appears the error's caused by something being wrong in angular.json - I must've missed it when manually looking through my files. I threw it in JSONLint and it immediately threw an error. You can obviously do this for other files, but I'm going to assume this error is mainly caused by angular.json.

I’ll try it to see if it works for me.

I have found the problem. check the angular.json file.

"assets": [
              "src/favicon.ico",
              "src/assets",
            ],
            "styles": [
              "src/styles.css",
              "./node_modules/bootstrap/dist/css/bootstrap.css",
              "./node_modules/@nebular/theme/styles/prebuilt/default.css",
            ],

just remove the comma after "src/assets" and "...default.css"
like below:

"assets": [
              "src/favicon.ico",
              "src/assets"
            ],
            "styles": [
              "src/styles.css",
              "./node_modules/bootstrap/dist/css/bootstrap.css",
              "./node_modules/@nebular/theme/styles/prebuilt/default.css"
            ],

then will fix the problem.
Somehow if the comma is in js code it will work. But not here.

Thanks to @xlxAciDxlx !

I do not have the commas, which you mention and I keep giving the error.

@leoliuasia Glad you were able to get it fixed :D

@hitokiri Did you try running your angular.json through JSONLint? Even if you don't have the commas, could be some other minor error messing it up.

@hitokiri May be you need to check the other positons that not same as my. Or just use the JSONLint tool mentioned by @xlxAciDxlx

@leoliuasia thank you! I had the same error and running my angular.json through json found the issue. There was a comment in the file that I had to remove. ng generate component works now.

I had comma in tsconfig.json, so try to check all json files in json lint.

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_This action has been performed automatically by a bot._

Was this page helpful?
0 / 5 - 0 ratings