Javascript 在Angular5中包含样式表和脚本的正确方式是什么？_Javascript_Html_Angular

Javascript 在Angular5中包含样式表和脚本的正确方式是什么？

javascript html angular

Javascript 在Angular5中包含样式表和脚本的正确方式是什么？,javascript,html,angular,Javascript,Html,Angular,My index.html文件： <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>Code Concrete</title> <base href="/"> <meta name="viewport" content="width=device-width, initial-scale=1">

My index.html文件：

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Code Concrete</title>
  <base href="/">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" 
    href="assets/bower_components/bootstrap/dist/css/bootstrap.css">
  <link rel="stylesheet" 
    href="assets/bower_components/bootstrap/dist/css/bootstrap.min.css">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
</head>

<body>
  <app-root></app-root>
  <button class="btn btn-md btn-primary" id="btn-test">Click this!</button>

  <!--Latest Jquery Library-->
  <script src="/node_modules/jquery/dist/jquery.min.js"></script>
  <!--Custom JS-->
  <script src="assets/js/custom.js"></script>
</body>
</html>


代码混凝土
点击这个！

引导样式使用该格式。但是html似乎无法加载jquery库。我检查了道路和所有东西，我觉得一切都很好。我做错了什么？在angular5中包含样式表和脚本的正确方法是什么

提前谢谢

在angular5中包含样式表和脚本的正确方式是什么

在angular（v5）中，以正确的方式导入这些文件，以将其包含到

样式

和

脚本

数组下的

.angular cli.json

文件中。像这样-

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

PS：在Angular（v6）的最新版本中，

.Angular cli.json

文件已被重命名为

Angular.json

文件您可以通过将脚本和样式表的路径添加到Angular-cli.json文件中，将外部脚本和样式添加到项目中

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

Angular CLI和许多其他Angular开发人员使用Webpack将所有内容打包到一个更高效的生产应用程序中

因此，以一种配置文件可以清楚地看到它的方式为其提供信息是非常常见的

如果在angular 5之前使用angular cli，它应该位于，

.angular cli.json

现在我相信Angular 6是

Angular.json

文件

您可以使用anguar cli json添加扩展脚本和样式表。如果您使用Angular cli，则应在.Angular-cli.json文件的“样式”和“脚本”中提及它们属性。我在哪里可以看到angular cli.json？在项目目录根中如果使用angular cli创建项目，则angular-cli.json将位于根目录中我编辑angular.json文件并放置所有样式和脚本路径。起初它不起作用。我尝试通过angular cli使用“ng serve”重新启动服务器。瞧！它起作用了！非常感谢！