javascript - 如何在 Angular 9 中正确安装预建模板

问题描述

我正在尝试在我的 Angular 9 应用程序中使用免费模板，但多次失败。尽管进行了多次尝试，但滑块、产品和主页横幅并未出现。我建议您下载一次模板并检查文件夹目录以便更好地理解。

1）我尝试通过 NPM 安装 js 和 CSS 文件，然后在 angular.json 脚本和样式数组中调用所需的文件，但有些包不起作用，尽管它们中的大多数都可以。

2) 通过 src/assets/js/bootstrap.min.js 和 src/assets/css/bootstrap.min.css 等 js 和 CSS 文件夹调用 js 和 CSS 文件，但它没有帮助并产生很多错误。

3）解压缩源文件夹中的文件，然后像 src/assets/source/bootstrap-4.4.1-dist/js/bootstrap.min.js 一样调用它们，但这也返回了一些错误。

到目前为止，我使用 NPM 包并在 angular.json 中调用 then 获得了最好的结果，但 jQuery 仍然没有按预期工作。

角.json：

"styles": [
              "src/assets/sass/style.scss",
              "./node_modules/bootstrap/dist/css/bootstrap.min.css",
              "./node_modules/slicknav/dist/slicknav.min.css",
              "./node_modules/elegant-icons/style.css",
              "./node_modules/font-awesome/css/font-awesome.min.css",
              "./node_modules/jquery-ui-dist/jquery-ui.min.css",
              "./node_modules/jquery-nice-select/css/nice-select.css",
              "./node_modules/owl.carousel/dist/assets/owl.carousel.min.css",
              "src/assets/css/style.css",
              "src/styles.scss"
            ],
            "scripts": [
              "./node_modules/jquery/dist/jquery.min.js",
              "./node_modules/bootstrap/dist/js/bootstrap.min.js",
              "./node_modules/jquery-ui-dist/jquery-ui.min.js",
              "./node_modules/jquery-nice-select/js/jquery.nice-select.min.js",
              "./node_modules/slicknav/dist/jquery.slicknav.min.js",
              "./node_modules/mixitup/dist/mixitup.min.js",
              "./node_modules/owl.carousel/dist/owl.carousel.min.js",
              "src/assets/js/main.js"
            ]

问题：

标签： javascripthtmljquerycssangular

尝试在index.html文件的 header 标签中添加 jQuery CDN，然后重新加载页面。

索引.html

<head>
...
    <script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
...
</head>

javascript - 如何在 Angular 9 中正确安装预建模板

问题描述

解决方案

推荐阅读