在 Angular 6 angular.json 中导入引导程序错误：ENOENT：没有这样的文件或目录

Question

在 Angular 6 中导入引导程序的正确方法是什么。在以前的版本中，我是这样做的并且它工作正常。

angular-cli.json（Angular 5）

"styles": [
    "styles.scss"
  ],
"scripts": [
    "../node_modules/jquery/dist/jquery.slim.min.js",
    "../node_modules/popper.js/dist/umd/popper.min.js",
    "../node_modules/bootstrap/dist/js/bootstrap.min.js"
  ],

angular.json（Angular 6）

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

得到错误：

Error: ENOENT: no such file or directory, open '/Users/pacozevallos/myApp/node_modules/jquery/dist/jquery.slim.min.js'

Answer 1

我看到您的错误是显示缺少 jquery 文件。但是bootstrap 4不需要jquery。如果您使用的是命令 npm install --save @ng-bootstrap/ng-bootstrap 来自 angular-cli 我认为不需要 jquery 依赖项。 还需要在主模块和要实现引导样式的模块中添加 import 语句：

import {NgbModule} from '@ng-bootstrap/ng-bootstrap';

不需要安装 jquery，可能会干扰 ng-bootstrap 代码。 也许您需要删除您可能安装的任何 jquery。

Answer 2

此配置应该可以工作，因为正如您在angular.json 文件中看到的那样，有用于导入文件的属性"root": "",，因此请按照以下代码进行操作

"styles": [
   "src/styles.scss",
   "node_modules/bootstrap/dist/css/bootstrap.min.css"
],
"scripts": [
   "node_modules/jquery/dist/jquery.slim.min.js",
   "node_modules/popper.js/dist/umd/popper.min.js",
   "node_modules/bootstrap/dist/js/bootstrap.min.js"
]