第一次使用 angular CLI 运行“ng serve”不会正确编译并给出错误

Running "ng serve" with angular CLI first time wont compile right and gives an error

提问人:Melonendk 提问时间:11/21/2017 最后编辑:Tristan HessellMelonendk 更新时间:12/19/2017 访问量:1787

问:

所以我正在尝试用 angular 开始我的第一个项目。

每次它不会像它不会那样编译并且没有错误地完成它时,很难解释,我希望你和我一起原谅这一点。ng serve

基本上,我在 Windows 9.1.0 Pro 5.5.1 位上运行 node-v10 和 npm-v64

我使用的命令是&和cd到文件夹并使用.npm install -g @angular/cling new ngvicng serve

然后我收到这个错误:

λ ng serve
** NG Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
Date: 2017-11-21T09:53:09.965Z
Hash: 
Time: 2522ms
chunk {inline} inline.bundle.js (inline) 5.79 kB [entry] [rendered]
chunk {main} main.bundle.js (main) 3.49 kB [initial] [rendered]
chunk {polyfills} polyfills.bundle.js (polyfills) 1.19 kB [initial] [rendered]
chunk {styles} styles.bundle.js (styles) 9.02 kB [initial] [rendered]
chunk {vendor} vendor.bundle.js (vendor) 853 kB [initial] [rendered]

ERROR in C:/Users/USERNAME/Documents/sites/ngvic/src/main.ts
Module build failed: Error: C:\Users\USERNAME\Documents\sites\ngvic\src\main.ts is not part of the compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property.
    at AngularCompilerPlugin.getCompiledFile (C:\Users\USERNAME\Documents\sites\ngvic\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:619:23)
    at plugin.done.then (C:\Users\USERNAME\Documents\sites\ngvic\node_modules\@ngtools\webpack\src\loader.js:467:39)
    at <anonymous>
 @ multi webpack-dev-server/client?http://0.0.0.0:0 ./src/main.ts
ERROR in C:/Users/USERNAME/Documents/sites/ngvic/src/polyfills.ts
Module build failed: Error: C:\Users\USERNAME\Documents\sites\ngvic\src\polyfills.ts is not part of the compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property.
    at AngularCompilerPlugin.getCompiledFile (C:\Users\USERNAME\Documents\sites\ngvic\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:619:23)
    at plugin.done.then (C:\Users\USERNAME\Documents\sites\ngvic\node_modules\@ngtools\webpack\src\loader.js:467:39)
    at <anonymous>
 @ multi ./src/polyfills.ts

webpack: Failed to compile.

这是ng -v

Angular CLI: 1.5.3
Node: 9.1.0
OS: win32 x64
Angular: 5.0.2
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cli: 1.5.3
@angular-devkit/build-optimizer: 0.0.33
@angular-devkit/core: 0.0.20
@angular-devkit/schematics: 0.0.36
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.8.3
@schematics/angular: 0.1.5
typescript: 2.4.2
webpack: 3.8.1

希望任何人都能帮上忙。 提前致谢。

编辑:添加了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": [
     "main.ts"
  ]
}

编辑 2:警告npm install

λ npm install
npm WARN [email protected] requires a peer of @angular/compiler@^2.3.1 || >=4.0.0-beta <5.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of @angular/core@^2.3.1 || >=4.0.0-beta <5.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

added 115 packages in 7.541s
JavaScript 节点:.js 角度

评论

0赞 Melonendk 11/21/2017
站点注释:我将文件夹更改为 USERNAME,而不是我的 PC 名称。
0赞 Armen Vardanyan 11/21/2017
你能发布你的文件内容吗?tsconfig.json
0赞 Melonendk 11/21/2017
@ArmenVardanyan完成。

答:

0赞 Sachila Ranawaka 11/21/2017 #1

将文件添加到 under 属性中。main.tstsconfig.jsoninclude

{
  "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": [
     "main.ts", 
  ]
}

评论

0赞 Melonendk 11/21/2017
尝试后不起作用,只是说那是在我从 ts“ 部分中删除之后Error: error TS5023: Unknown compiler option 'include'.,
0赞 Sachila Ranawaka 11/21/2017
@MeickiJeldal需要添加"compilerOptions": {},
0赞 Melonendk 11/21/2017
它在那里,但我需要把它放在里面还是
0赞 Sachila Ranawaka 11/21/2017
对不起应该在对象之外includecompilerOptions
0赞 Melonendk 11/21/2017
它给了我这个Error: error TS18003: No inputs were found in config file 'tsconfig.json'. Specified 'include' paths were '["../main.ts"]' and 'exclude' paths were '["test.ts","**/*.spec.ts"]'.
0赞 Voltaire John Secondes Biton 11/21/2017 #2

尝试仅在终端中运行。这为我解决了我的第一个角度项目中的问题npm install

评论

0赞 Melonendk 11/21/2017
这样做也行不通。它运行并更改,然后发出警告(检查编辑 2)
0赞 Voltaire John Secondes Biton 11/21/2017
你能在 tsconfig.json 的 compilerOptions 下添加 “baseUrl”: “src” 吗?
0赞 Voltaire John Secondes Biton 11/21/2017
尝试运行此操作。 然后和最后npm i -g npm-check-updatesncu -anpm install
0赞 Voltaire John Secondes Biton 11/21/2017
如果失败,请尝试使用此代码在本地安装 angular-clinpm install --save-dev @angular/cli@latest
0赞 Melonendk 11/21/2017
在我出于某种原因错误之后,现在尝试了所有错误npm install typescript@=2.4.2TS5014: Failed to parse file 'C:/Users/Melon/Dokumenter/sites/ngvic/tsconfig.json': Unexpected token } in JSON at position 361.