Question

如何将外部样式表包括在角度项目中，以及如何在不同的组件中使用它们。谁能告诉我包括样式表的整个过程。

我正在尝试在我的角度项目中使用自定义构建的模板。我拥有所有代码（HTML，css），但是我无法在我的角度项目中（特别是css）添加或导入所有代码。

Answer 1

您可以在projectname / src /目录中覆盖styles.css文件。

或者您可以将有问题的样式文件（somename.css）添加到样式数组中的angular.json文件中

"version": 1,
  "newProjectRoot": "projects",
  "projects": {
    "somthing": {
      "root": "",
      "sourceRoot": "src",
      "projectType": "application",
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
            "outputPath": "dist",
            "index": "src/index.html",
            "main": "src/main.ts",
            "tsConfig": "src/tsconfig.app.json",
            "polyfills": "src/polyfills.ts",
            "assets": [
              "src/assets",
              "src/favicon.ico"
            ],
            "styles": [
              "src/styles.css"
            ],
            "scripts": []
          },
          "configurations": {
            "production": {
              "optimization": true,
              "outputHashing": "all",
              "sourceMap": false,
              "extractCss": true,
              "namedChunks": false,
              "aot": true,
              "extractLicenses": true,
              "vendorChunk": false,
              "buildOptimizer": true,
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.prod.ts"
                }
              ]
            }

Answer 2

在 assets 文件夹中

添加一个名为 css 的文件夹，并将所有的CSS文件放入其中。
之后，在styles.css文件（该文件存在src文件夹中）中，将导入添加到您的css文件中：

/* You can add global styles to this file, and also import other style files */

@import "assets/css/name_of_file.css";

如何在角度项目中使用外部样式表？

2 个答案: