如何将引导模板集成到Angular中，请以正确的方式举例[关闭]

Posted 2023-04-13

【中文标题】如何将引导模板集成到Angular中，请以正确的方式举例[关闭]

【英文标题】：How to integrate bootstrap template into Angular please proper way with example [closed]

【发布时间】：2021-10-19 01:07:29

【问题描述】：

我是角度的新手..... 将引导模板集成到一个角度项目中所有资产文件意味着 index.html 中包含的 js 和 css 文件这些都不能正常工作也没有响应我的网站请告诉我正确的方法然后我继续我的项目谢谢

【参考方案1】：

将您的文件导入/assets 文件夹。

在angular.json 下"styles" 和"scripts"

"projects": 
    "projectname": 
      "root": "",
      "sourceRoot": "src",
      "projectType": "application",
      "prefix": "app",
      "schematics": ,
      "architect": 
        "build": 
          "builder": "@angular-devkit/build-angular:browser",
          "options": 
            "progress": false,
            "outputPath": "dist",
            "index": "src/index.html",
            "main": "src/main.ts",
            "polyfills": "src/polyfills.ts",
            "tsConfig": "src/tsconfig.app.json",
            "assets": ["src/assets"],
            "styles": [
              "src/styles.css",
              "src/assets/css/bootstrap.min.css"
              // other css files go here
            ],
            "scripts": [
              "src/assets/js/bootstrap.min.js",
              // other js files go here. 
            ]

重新启动您的应用程序，它应该可以工作了。

【讨论】：

不将 .css 或 .js 放在 assets 文件夹中。当您更改 angular.json 时，Angular 会创建一个完整的 .css 和一个 full.js。 Assets 文件夹用于存储必需的图像或 .json 但从不您尚未使用 angular.json 导入的 css 和 .js

其实angular.json是用来导入资产的。 assets 文件夹用于存放 css 和 js。我认为您需要阅读他们关于包含模板的官方文档

我想说，如果你使用 assets 文件夹，你有，例如bootstrap.min.css 在 assets 文件夹和 styles.688b7459da5be05405f0.css 中。 （真的你的应用程序从不使用资产文件夹中的 bootstrap.min.css）

您的问题和疑虑无效。仅仅因为和资产在资产文件夹或任何文件夹中并不意味着它不能被导入到angular.json

如果我们的 bootstrap.min.css 在文件夹 "css" 中，你可以在 angular.json 中使用，例如"styles": ["src/styles.css","css/bootstrap.min.css"]，看看这个链接：medium.com/@kmathy/…（现在，我不记得另一个更合适的了）