Jquery无法工作在角度6错误:ENOENT:没有这样的文件或目录,打开’… \ node_modules \ jquery \ dist \ jquery.min.js’

我正在将Angular 5项目迁移到Angular 6。

在开始申请时

npm start 

得到以下错误

  ** Angular Live Development Server is listening on localhost: 9000, open your browser on http://localhost:9000/ ** 91% additional asset processing scripts-webpack-plugin× 「wdm」: Error: ENOENT: no such file or directory,open'\trunk\node_modules\jquery\dist\jquery.min.js' 

我试过了

 npm install jquery --save npm install @types/jquery --save 

没有什么工作

我检查了我的节点模块文件夹,我可以看到jquery文件

粘贴我的package.json和angular.json

的package.json

 "dependencies": { "@angular/animations": "^6.0.0", "@angular/common": "^6.0.0", "@angular/compiler": "^6.0.0", "@angular/core": "^6.0.0", "@angular/forms": "^6.0.0", "@angular/http": "^6.0.0", "@angular/platform-browser": "^6.0.0", "@angular/platform-browser-dynamic": "^6.0.0", "@angular/router": "^6.0.0", "@ng-bootstrap/ng-bootstrap": "^2.0.0", "bootstrap": "^4.1.1", "core-js": "^2.5.4", "font-awesome": "^4.7.0", "jquery": "^3.3.1", "@types/jquery": "^3.3.1", "popper.js": "^1.14.3", "rxjs": "^6.0.0", "zone.js": "^0.8.26" }, "devDependencies": { "@angular/compiler-cli": "^6.0.0", "@angular-devkit/build-angular": "~0.6.0", "typescript": "~2.7.2", "@angular/cli": "~6.0.0", "@angular/language-service": "^6.0.0", "@types/jasmine": "~2.8.6", "@types/jasminewd2": "~2.0.3", "@types/node": "~8.9.4", "codelyzer": "~4.2.1", "jasmine-core": "~2.99.1", "jasmine-spec-reporter": "~4.2.1", "karma": "~1.7.1", "karma-chrome-launcher": "~2.2.0", "karma-coverage-istanbul-reporter": "~1.4.2", "karma-jasmine": "~1.1.1", "karma-jasmine-html-reporter": "^0.2.2", "protractor": "~5.3.0", "ts-node": "~5.0.1", "tslint": "~5.9.1" } 

angular.json

 "styles": [ "src/styles.css", "../node_modules/bootstrap/dist/css/bootstrap.min.css", "./assets/css/font-icon.css", "../node_modules/font-awesome/css/font-awesome.css" ], "scripts": [ "../node_modules/jquery/dist/jquery.min.js", "../node_modules/popper.js/dist/umd/popper.min.js", "../node_modules/bootstrap/dist/js/bootstrap.min.js" ] 

请帮我解决这个问题。

有远见的团队再一次让事情变得更难而不是真正的原因=(

我遇到了这个问题,谷歌搜索后无果而终,我想知道他们是否以某种方式更改了相对路径以及重命名angular-cli.json。

在文件中稍微向上我发现了这一行:

是的,只需改变:

 "../node_modules/jquery/dist/jquery.js", "../node_modules/tether/dist/js/tether.js", "../node_modules/bootstrap/dist/js/bootstrap.js" 

 "./node_modules/jquery/dist/jquery.js", "./node_modules/tether/dist/js/tether.js", "./node_modules/bootstrap/dist/js/bootstrap.js" 

使用这个npm install --save @ng-bootstrap/ng-bootstrap安装@ngBootstrap npm install --save @ng-bootstrap/ng-bootstrapnpm install jquery --savenpm install @types/jquery --save安装后转到angular.json并找到

 "styles": [ { "input": "styles.css" } ], "scripts": [] 

并将其更改为:

 "styles": [ "styles.css", "./node_modules/bootstrap/dist/css/bootstrap.min.css" ], "scripts": [ "./node_modules/jquery/dist/jquery.min.js", "./node_modules/bootstrap/dist/js/bootstrap.min.js" ] 

ng server --open以运行您的项目

在Angular 6中你不需要写:

 "../node_modules/jquery/dist/jquery.js", "../node_modules/tether/dist/js/tether.js", "../node_modules/bootstrap/dist/js/bootstrap.js" 

您可以使用./ like来编写,这也可以,但是angular.json文件中最简单的方法:

 "node_modules/jquery/dist/jquery.js", "node_modules/tether/dist/js/tether.js", "node_modules/bootstrap/dist/js/bootstrap.js" 

在我看来,它更好,更清晰

对于Angular 6,路径如下:

来自

 "../node_modules/jquery/dist/jquery.js", "../node_modules/tether/dist/js/tether.js", "../node_modules/bootstrap/dist/js/bootstrap.js" 

 "./node_modules/jquery/dist/jquery.js", "./node_modules/tether/dist/js/tether.js", "./node_modules/bootstrap/dist/js/bootstrap.js" 

在您的文件’tsconfig.json’中,您可以制作

 { "compileOnSave": false, "compilerOptions": { "baseUrl": "./", "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"], } 

你可以替换

 "include": ["node_modules/angular-bootstrap-md/**/*.ts", "src/**/*.ts"], 

 "include": ["src/**/*.ts","node_modules/angular-bootstrap-md/**/*.ts" ], 

此外,在你的’angular.json’文件中,我删除了“styles”和“scripts”中node_modules前面的“../”。

我在“测试”类别的“脚本”中复制了“脚本”的行

 "test": { ... "styles": [ "src/styles.css" "node_modules/bootstrap/dist/css/bootstrap.min.css", "./assets/css/font-icon.css", "node_modules/font-awesome/css/font-awesome.css" ], "scripts": [ "node_modules/jquery/dist/jquery.min.js", "node_modules/popper.js/dist/umd/popper.min.js", "node_modules/bootstrap/dist/js/bootstrap.min.js" ], ... 

相对路径../用于返回一个目录。 因此,首先检查文件路径,如果它不包含您正在其他地方甚至不存在的jquery文件的项目根文件夹。

如果node_modules文件和angular.json都在同一目录中,则不需要使用相对路径。

在Angular 6中,您不需要使用相对路径从angular.json( ../或甚至类似./ )进入node_modules。