angular - 基本角度应用程序无法运行,错误模块构建失败:找不到模块../@angular-devkit/src/babel/X
问题描述
我是 Angular 的新手,并且正在按照文档构建一个基本的应用程序。
节点 - v14.7.3
npm - 7.22.0
Angular CLI:12.2.4
操作系统:win32 x64
@angular-devkit/architect 0.1202.4
@angular-devkit/build-angular 12.2.4
@angular-devkit/core 12.2.4
@ angular-devkit/schematics 12.2.4
@schematics/angular 12.2.4
rxjs 6.6.7 typescript
4.3.5
到目前为止,我所做的只是
npm install @angular/cli
其次是ng new firstApp
和ng serve
以下是我收到的错误,
√ Browser application bundle generation complete.
Initial Chunk Files | Names | Size
runtime.js | runtime | 4.89 kB
main.js | main | 3.56 kB
polyfills.js | polyfills | 3.55 kB
styles.js | styles | 3.54 kB
| Initial Total | 15.54 kB
Build at: 2021-09-06T06:20:42.162Z - Hash: f81b11c218148f716cf3 - Time: 10951ms
../../../../#Development/Files/angularProjects/firstApp/src/main.ts - Error: Module build failed: Error: Cannot find module 'F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\build-angular\src\babel\webpack-loader.js'
Require stack:
- F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\ProgressPlugin.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\index.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\build-webpack\src\webpack\index.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\build-webpack\src\index.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\build-angular\src\dev-server\index.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\architect\node\node-modules-architect-host.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\architect\node\index.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular\cli\models\architect-command.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular\cli\commands\serve-impl.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\schematics\tools\export-ref.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\schematics\tools\index.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular\cli\utilities\json-schema.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular\cli\models\command-runner.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular\cli\lib\cli\index.js
- C:\Users\Admin\AppData\Roaming\npm\node_modules\@angular\cli\lib\init.js
- C:\Users\Admin\AppData\Roaming\npm\node_modules\@angular\cli\bin\ng
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:902:15)
at Function.Module._load (internal/modules/cjs/loader.js:746:27)
at Module.require (internal/modules/cjs/loader.js:974:19)
at require (internal/modules/cjs/helpers.js:92:18)
at F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\ProgressPlugin.js:412:9
at Hook.eval [as call] (eval at create (F:\#Development\Files\angularProjects\firstApp\node_modules\tapable\lib\HookCodeFactory.js:19:10), <anonymous>:7:1)
at NormalModule.doBuild (F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\NormalModule.js:768:24)
at NormalModule.build (F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\NormalModule.js:920:15)
at F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\Compilation.js:1322:12
at NormalModule.needBuild (F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\NormalModule.js:1192:32)
../../../../#Development/Files/angularProjects/firstApp/src/polyfills.ts - Error: Module build failed: Error: Cannot find module 'F:\#Development\Files\angularProjects\firstApp\node_modules\@ngtools\webpack\src\ivy\index.js'
Require stack:
- F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\ProgressPlugin.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\index.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\build-webpack\src\webpack\index.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\build-webpack\src\index.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\build-angular\src\dev-server\index.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\architect\node\node-modules-architect-host.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\architect\node\index.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular\cli\models\architect-command.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular\cli\commands\serve-impl.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\schematics\tools\export-ref.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\schematics\tools\index.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular\cli\utilities\json-schema.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular\cli\models\command-runner.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular\cli\lib\cli\index.js
- C:\Users\Admin\AppData\Roaming\npm\node_modules\@angular\cli\lib\init.js
- C:\Users\Admin\AppData\Roaming\npm\node_modules\@angular\cli\bin\ng
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:902:15)
at Function.Module._load (internal/modules/cjs/loader.js:746:27)
at Module.require (internal/modules/cjs/loader.js:974:19)
at require (internal/modules/cjs/helpers.js:92:18)
at F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\ProgressPlugin.js:412:9
at Hook.eval [as call] (eval at create (F:\#Development\Files\angularProjects\firstApp\node_modules\tapable\lib\HookCodeFactory.js:19:10), <anonymous>:7:1)
at NormalModule.doBuild (F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\NormalModule.js:768:24)
at NormalModule.build (F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\NormalModule.js:920:15)
at F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\Compilation.js:1322:12
at NormalModule.needBuild (F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\NormalModule.js:1192:32)
../../../../#Development/Files/angularProjects/firstApp/src/styles.css - Error: Module build failed: Error: Cannot find module 'F:\#Development\Files\angularProjects\firstApp\node_modules\mini-css-extract-plugin\dist\loader.js'
Require stack:
- F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\ProgressPlugin.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\index.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\build-webpack\src\webpack\index.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\build-webpack\src\index.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\build-angular\src\dev-server\index.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\architect\node\node-modules-architect-host.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\architect\node\index.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular\cli\models\architect-command.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular\cli\commands\serve-impl.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\schematics\tools\export-ref.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\schematics\tools\index.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular\cli\utilities\json-schema.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular\cli\models\command-runner.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular\cli\lib\cli\index.js
- C:\Users\Admin\AppData\Roaming\npm\node_modules\@angular\cli\lib\init.js
- C:\Users\Admin\AppData\Roaming\npm\node_modules\@angular\cli\bin\ng
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:902:15)
at Function.Module._load (internal/modules/cjs/loader.js:746:27)
at Module.require (internal/modules/cjs/loader.js:974:19)
at require (internal/modules/cjs/helpers.js:92:18)
at F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\ProgressPlugin.js:412:9
at Hook.eval [as call] (eval at create (F:\#Development\Files\angularProjects\firstApp\node_modules\tapable\lib\HookCodeFactory.js:19:10), <anonymous>:7:1)
at Hook.CALL_DELEGATE [as _call] (F:\#Development\Files\angularProjects\firstApp\node_modules\tapable\lib\Hook.js:14:14)
at NormalModule.doBuild (F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\NormalModule.js:768:24)
at NormalModule.build (F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\NormalModule.js:920:15)
at F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\Compilation.js:1322:12
../../../../#Development/Files/angularProjects/firstApp/src/app/app.component.css - Error: Module build failed (from ../../../../#Development/Files/angularProjects/firstApp/node_modules/postcss-loader/dist/cjs.js):
Error: Cannot find module 'F:\#Development\Files\angularProjects\firstApp\node_modules\postcss-loader\dist\cjs.js'
Require stack:
- F:\#Development\Files\angularProjects\firstApp\node_modules\loader-runner\lib\loadLoader.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\loader-runner\lib\LoaderRunner.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\NormalModuleFactory.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\Compiler.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\ProgressPlugin.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\index.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\build-webpack\src\webpack\index.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\build-webpack\src\index.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\build-angular\src\dev-server\index.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\architect\node\node-modules-architect-host.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\architect\node\index.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular\cli\models\architect-command.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular\cli\commands\serve-impl.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\schematics\tools\export-ref.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular-devkit\schematics\tools\index.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular\cli\utilities\json-schema.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular\cli\models\command-runner.js
- F:\#Development\Files\angularProjects\firstApp\node_modules\@angular\cli\lib\cli\index.js
- C:\Users\Admin\AppData\Roaming\npm\node_modules\@angular\cli\lib\init.js
- C:\Users\Admin\AppData\Roaming\npm\node_modules\@angular\cli\bin\ng
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:902:15)
at Function.Module._load (internal/modules/cjs/loader.js:746:27)
at Module.require (internal/modules/cjs/loader.js:974:19)
at require (internal/modules/cjs/helpers.js:92:18)
at loadLoader (F:\#Development\Files\angularProjects\firstApp\node_modules\loader-runner\lib\loadLoader.js:19:17)
at iteratePitchingLoaders (F:\#Development\Files\angularProjects\firstApp\node_modules\loader-runner\lib\LoaderRunner.js:182:2)
at runLoaders (F:\#Development\Files\angularProjects\firstApp\node_modules\loader-runner\lib\LoaderRunner.js:397:2)
at NormalModule.doBuild (F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\NormalModule.js:773:3)
at NormalModule.build (F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\NormalModule.js:920:15)
at F:\#Development\Files\angularProjects\firstApp\node_modules\webpack\lib\Compilation.js:1322:12
Error: Module not found: Error: Can't resolve 'F:\#Development\Files\angularProjects\firstApp\node_modules\webpack-dev-server\client\index.js?http://0.0.0.0:0&sockPath=/sockjs-node' in 'F:\#Development\Files\angularProjects\firstApp'
Error: Module not found: Error: Can't resolve 'F:\#Development\Files\angularProjects\firstApp\node_modules\webpack-dev-server\client\index.js?http://0.0.0.0:0&sockPath=/sockjs-node' in 'F:\#Development\Files\angularProjects\firstApp'
Error: Module not found: Error: Can't resolve 'F:\#Development\Files\angularProjects\firstApp\node_modules\webpack-dev-server\client\index.js?http://0.0.0.0:0&sockPath=/sockjs-node' in 'F:\#Development\Files\angularProjects\firstApp'
Error: node_modules/@angular/platform-browser/platform-browser.d.ts:45:22 - error NG6002: Appears in the NgModule.imports of AppModule, but could not be resolved to an NgModule class.
This likely means that the library (@angular/platform-browser) which declares BrowserModule has not been processed correctly by ngcc, or is not compatible with Angular Ivy. Check if a newer version of the library is available, and update if so. Also consider checking with the library's authors to see if the library is expected to be compatible with Ivy.
45 export declare class BrowserModule {
我尝试了以下方法来解决此问题,
- 尝试删除node_modules,删除packacge-lock,清除npm缓存,最后安装npm,这种方法已经解决了许多以前的堆栈溢出问题,但对我来说问题仍然存在。
- 我尝试安装不同版本的 angular-cli,尝试将它们与不同节点版本和不同 npm 版本的兼容性匹配,但是由于多个损坏的依赖关系,我无法正确执行。
请提出一些解决方案,谢谢
解决方案
我遇到了与您相同的问题,尽管可能很奇怪,但问题在于#
您的文件路径上的符号(例如 . F:\#Development
)。
我将 Angular 应用程序移动到另一个不包含#
并且不再产生错误的路径。
推荐阅读
- office-js - 如何使用 Office-js API 使自定义 Word-Addin 检查拼写错误
- c++ - 函数返回的类的析构函数
- android - 如何从 Facebook 帐户工具包中获取用户输入的号码?
- node.js - 我无法访问此文件名 [{"filename":"54526108_1946746692102415_4003062236024143872_n.jpg"}]
- javascript - 如何将字符串转换为 mongodb ObjectId?
- mongodb - 在 mongo 中使用 group 时,如何获得嵌套数组大小的嵌套数组?
- vba - 可搜索的文本框和 vba 突出显示连续表单中的行,并将记录置于顶部,其余记录跟随
- android - 持有代表 500 个对象的 json 对象时,如何每次循环创建 20 个对象?
- spring-boot - Spring `@Scheduled` 直到第一次 HTTP 命中才开始?
- c# - 带有 ASP-NET 和 Angular 的 Visual Studio 在浏览器中显示 TimeoutException