Typescript: An invalid JSON tsconfig.json give a bad error message

Created on 21 Feb 2016  路  7Comments  路  Source: microsoft/TypeScript

TypeScript Version:
1.7.5

Code

When running tsc is an empty project folder with a tsconfig.json file such as :

{
    "version": "1.7.5",
    "compilerOptions": {
        "module": "commonjs",
        "target": "es5",
        "noImplicitAny": false,
        "outDir": "built",
        "rootDir": ".",
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true
        // comment
    },
    "exclude": [
        "node_modules",
        "client"   // another comment
    ]
}

note that there are comments in that json file, which makes it invalid but it's easy to miss that especially if your code editor doesn't highlight it as an error but as a comment.

tsc will exit with an error that, as a beginner, couldn't figure out.

/data/code/tsrest$ tsc
/usr/lib/node_modules/typescript/lib/tsc.js:31084
            var jsonOptions = json["compilerOptions"];
                                  ^

TypeError: Cannot read property 'compilerOptions' of undefined
    at getCompilerOptions (/usr/lib/node_modules/typescript/lib/tsc.js:31084:35)
    at Object.parseJsonConfigFileContent (/usr/lib/node_modules/typescript/lib/tsc.js:31074:22)
    at parseConfigFile (/usr/lib/node_modules/typescript/lib/tsc.js:31351:40)
    at performCompilation (/usr/lib/node_modules/typescript/lib/tsc.js:31362:45)
    at Object.executeCommandLine (/usr/lib/node_modules/typescript/lib/tsc.js:31336:9)
    at Object.<anonymous> (/usr/lib/node_modules/typescript/lib/tsc.js:31635:4)
    at Module._compile (module.js:409:26)
    at Object.Module._extensions..js (module.js:416:10)
    at Module.load (module.js:343:32)
    at Function.Module._load (module.js:300:12)

Searching on the faq and google didn't help and I eventually posted a stack overflow question http://stackoverflow.com/questions/35526404/tsc-ignores-my-tsconfig-json-file/35533849#35533849
My assuption was that tsc, or node, or npm was badly installed, or that I had a path problem.
I eventually figured out that tsc couldn't parse my tsconfig.json because of the comments in it.

Expected behavior:
tsc should exit with an error that makes it clear that it was unable to parse the tsconfig.json file.

Actual behavior:
displays an error message that makes sense only when you already know what the problem is.

Bug

Most helpful comment

file: 'file:///d%3A/xampp/htdocs/Angular%2022/tsconfig.json'
severity: 'Warning'
message: 'Problems loading reference 'http://json.schemastore.org/tsconfig': Unable to load schema from 'http://json.schemastore.org/tsconfig': Unable to to connect to http://json.schemastore.org/tsconfig. Error: getaddrinfo ENOENT json.schemastore.org:80'
at: '1,1'
source: ''

tsconfig json
package

All 7 comments

Im not sure why is TypeScript trying to add comments to its config files. Generally speaking, you should never use comments in json. JSON should be all data, it is not anything functional. see http://stackoverflow.com/a/244858/820942

That being said I can understand frustration trying to debug without good error message, but still, comments shuld not be supported in json file.

@Tomino2112 I'm not advocating that typescript should accept comments, though for a config file I think that it could make sense and there is an open issue about it.

I'm just saying that a better error message should, if possible, be provided when the json config file can't be parsed, wether it's because of the presence of comments or because of another error in the JSON.

Comments in tsconfig.json are allowed in 1.8. Also situation when tsconfig.json contains invalid JSON is now handled gracefully:

{
    "version": "1.7.5",
    "compilerOptions": {
        "module": "commonjs",
        "target": "es5",
        "noImplicitAny": false,
        "outDir": "built",
        "rootDir": ".",
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true
        // comment
    },
    "exclude": [
        "node_modules",
        "client"   // another comment
    ], // extra colon
}

Error reported by the tsc:

error TS5014: Failed to parse file 'tsconfig.json': Unexpected token }.

@vladima that is perfect.

file: 'file:///d%3A/xampp/htdocs/Angular%2022/tsconfig.json'
severity: 'Warning'
message: 'Problems loading reference 'http://json.schemastore.org/tsconfig': Unable to load schema from 'http://json.schemastore.org/tsconfig': Unable to to connect to http://json.schemastore.org/tsconfig. Error: getaddrinfo ENOENT json.schemastore.org:80'
at: '1,1'
source: ''

tsconfig json
package

I've the same issue

Trying to use mdbootstrap in my angular 2 project.

tsconfig.json:
{ "compileOnSave": false, "compilerOptions": { "outDir": "./dist/out-tsc", "sourceMap": true, "declaration": false, "moduleResolution": "node", "emitDecoratorMetadata": true, "experimentalDecorators": true, "target": "es5", "typeRoots": [ "node_modules/@types" ], "lib": [ "es2017", "dom" ], "include": ["node_modules/angular-bootstrap-md/**/*.ts", "src/**/*.ts"], } }
And the error is

_D:\Projects\NG\myapp>ng serve
error TS5014: Failed to parse file 'D:/Projects/NG/wisdomwords/tsconfig.json': Unexpected token } in JSON at position 439.

Error: error TS5014: Failed to parse file 'D:/Projects/NG/wisdomwords/tsconfig.json': Unexpected token } in JSON at position 439.

at AngularCompilerPlugin._setupOptions (D:\Projects\NG\wisdomwords\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:90:19)
at new AngularCompilerPlugin (D:\Projects\NG\wisdomwords\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:43:14)
at _createAotPlugin (D:\Projects\NG\wisdomwords\node_modules\@angular\cli\models\webpack-configs\typescript.js:77:16)
at Object.getNonAotConfig (D:\Projects\NG\wisdomwords\node_modules\@angular\cli\models\webpack-configs\typescript.js:100:19)
at NgCliWebpackConfig.buildConfig (D:\Projects\NG\wisdomwords\node_modules\@angular\cli\models\webpack-config.js:37:37)
at Class.run (D:\Projects\NG\wisdomwords\node_modules\@angular\cli\tasks\serve.js:71:98)
at check_port_1.checkPort.then.port (D:\Projects\NG\wisdomwords\node_modules\@angular\cli\commands\serve.js:123:26)
at <anonymous>
at process._tickCallback (internal/process/next_tick.js:188:7)_
Was this page helpful?
0 / 5 - 0 ratings

Related issues

fdecampredon picture fdecampredon  路  358Comments

kimamula picture kimamula  路  147Comments

yortus picture yortus  路  157Comments

xealot picture xealot  路  150Comments

disshishkov picture disshishkov  路  224Comments