角度 cli webpack beta.24 全局引导和 jquery 不起作用答案

【问题标题】：angular cli webpack beta.24 global bootstrap and jquery not working角度 cli webpack beta.24 全局引导和 jquery 不起作用
【发布时间】：2019-12-26 21:12:13
【问题描述】：

我正在使用 angular-cli beta24 学习 angular2。我想全局设置引导程序和 jquery。我按照angular-cli page 上的说明进行操作，但没有成功。我想知道如何解决这个问题。

NodeJS 版本：6.9.2

操作系统：Windows 10 64 位

引导版本：3.3.7

jquery 版本：3.1.1

角-cli.json：

浏览器中显示的错误：

【问题讨论】：

在将脚本添加到 angular-cli.json 后是否重新启动了 Angular2 应用程序？我的意思是再次运行ng serve。
当然，我重启了，还是不行。

标签： angular angular-cli

【解决方案1】：

新建一个终端并使用以下 npm 命令安装 bootstrap 和 jquery

npm install bootstrap --save-dev
npm install jquery --save-dev

然后打开你的 angular.json 文件并添加以下行

"styles": [
    "../node_modules/bootstrap/dist/css/bootstrap.css",
    "styles.css"
],

还有

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

【讨论】：

【解决方案2】：

您似乎缺少 JQuery。在 Bootstrap 之前加载 JQuery，它应该可以解决您的问题。

JQuery Website

How JQuery Works Example

摘录：

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>Demo</title>
</head>
<body>
    <a href="http://jquery.com/">jQuery</a>
    <script src="jquery.js"></script>
    <script>

    // Your code goes here.

    </script>
</body>
</html>

【讨论】：

使用 angular-cli 你不必在 index.html 中添加 jquery，你可以将它添加到 angular-cli.json 配置文件中。