角度编译器错误(似乎是错误的实例)

Question

当我尝试运行"ng serve"时，我遇到了以下问题：

./src/main.ts 中的错误 模块构建失败：错误：检测到 Angular 编译器，但它是错误类的实例。 这可能意味着您安装了多个@ngtools/webpack 软件包。您可以使用npm ls @ngtools/webpack进行检查，然后删除多余的副本。

按照这个建议：

$ npm ls @ngtools/webpack test@0.0.0 C：\Daten\Projects\test-- @angular/cli@1.7.2 -- @ngtools/webpack@1.10.1

因此，没有安装多个 webpack 版本。我尝试多次重新安装@angular/cli....全球，本地，使用npm cache clean -f和npm cache verify.我对webpack做了同样的事情.可悲的是，没有多少人遇到这个问题，这使得它难以解决。我的谷歌研究没有成功，因为我只能找到一个中文页面将该错误翻译成中文和这两个SO链接(它们没有为我提供解决方案)：

https://stackoverflow.com/search?q=Angular+Compiler+was+detected

错误：安装了多个 @ngtools/webpack 包

在 Meteor 1.6 服务器和 Angular CLI 客户端 Angular-Meteor 子项目之间共享"node_modules"？

我的包.json：

"dependencies": {
"@angular/animations": "^5.2.0",
"@angular/common": "^5.2.0",
"@angular/compiler": "^5.2.0",
"@angular/core": "^5.2.0",
"@angular/forms": "^5.2.0",
"@angular/http": "^5.2.0",
"@angular/platform-browser": "^5.2.0",
"@angular/platform-browser-dynamic": "^5.2.0",
"@angular/router": "^5.2.0",
"core-js": "^2.4.1",
"rxjs": "^5.5.6",
"zone.js": "^0.8.19"
},
"devDependencies": {
"@angular/cli": "^1.7.2",
"@angular/compiler-cli": "^5.2.0",
"@angular/language-service": "^5.2.0",
"@types/jasmine": "~2.8.3",
"@types/jasminewd2": "~2.0.2",
"@types/node": "~6.0.60",
"codelyzer": "^4.0.1",
"jasmine-core": "~2.8.0",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~2.0.0",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "^1.2.1",
"karma-jasmine": "~1.1.0",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.1.2",
"ts-node": "~4.1.0",
"tslint": "~5.9.1",
"typescript": "2.6.2"
}
}

注意：

该项目可以在另一台PC上编译 - 唯一的区别是操作系统(他使用win7，而我使用win10)。

问候，有一个美好的周末，

梅瑟比尔

Answer 1

我刚刚遇到了同样的问题。不确定它是否与升级到 Angular CLI 1.7.2 有关(我从 1.6.1 升级)。

这是我为解决它所做的：

1. 将项目node_modules文件夹(只是运行npm install没有修复它)。
2. 以管理员身份在 Windows 10 中打开命令提示符(可能矫枉过正)。
3. 在项目文件夹中运行npm install。
4. 在 vscode 终端中，我成功运行了ng build。
5. 然后我成功地跑ng serve。

我从评论中看到您已经尝试了其中的一些，但这些步骤对我有用：-)

"devDependencies": {
"@angular/cli": "1.7.2",
"@angular/compiler-cli": "5.2.7",
"@types/node": "9.4.6",
"codelyzer": "4.2.1",
"ts-node": "5.0.1",
"tslint": "5.9.1",
"typescript": "2.4.2"
}

Answer 2

最后。更新我的全局打字稿版本修复了它。现在在全球范围内使用 tsc 2.6.2 并且可以工作。

现在使用以下方法：

• 打字稿2.6.2(全局和本地)
• @angular/CLI1.7.2(全球和本地)
  • 网络包3.11.0
• 节点 -v8.9.1
• npm -v5.5.1

Answer 3

尝试删除您的node_modules，并使用yarn install而不是npm install。它对我有用:)

Answer 4

要从package.json中的依赖项中删除额外的副本，您需要使用 save 标志：

npm uninstall --save webpack

如果您已将软件包安装为"devDependency"(即使用--save-dev)，则--save不会将其从package.json中删除。您需要使用--save-dev来卸载它。 这是上述命令工作良好的结果。

$ npm ls @ngtools/webpack
angularapp@0.0.0 C:Apache24htdocsangularapp
+-- @angular-devkit/build-angular@0.7.5
| `-- @ngtools/webpack@6.1.5
`-- @ngtools/webpack@6.2.1

---

$ npm uninstall --save webpack
> node-sass@4.9.3 install C:Apache24htdocsangularappnode_modulesnode-sass
> node scripts/install.js
Cached binary found at C:UsersuserAppDataRoamingnpm-cachenode-sass4.9.3win32-x64-59_binding.node
> node-sass@4.9.3 postinstall C:Apache24htdocsangularappnode_modulesnode-sass
> node scripts/build.js
Binary found at C:Apache24htdocsangularappnode_modulesnode-sassvendorwin32-x64-59binding.node
Testing binary
Binary is fine
added 1106 packages in 677.641s

---

$ npm ls @ngtools/webpack
angularapp@0.0.0 C:Apache24htdocsangularapp
`-- @angular-devkit/build-angular@0.7.5
`-- @ngtools/webpack@6.1.5