SCSS alias

@import "../../../scss/styles.scss";

@import "@styles/styles";

1. Ellenőrizd a Webpack Konfigurációt

Mivel az Angular CLI elrejti a webpack konfigurációt, gyakran nehéz közvetlenül hozzáférni vagy módosítani. Azonban, egy csomag, mint a @angular-builders/custom-webpack, lehetővé teszi, hogy kiterjeszd vagy módosítsd az Angular CLI által generált webpack konfigurációt.

Telepítheted ezt a csomagot a következő npm parancs segítségével:

npm install @angular-builders/custom-webpack --save-dev

angular.json

"architect": {
        "build": {
          "builder": "@angular-builders/custom-webpack:browser",
          "options": {
            "customWebpackConfig": {
              "path": "./extra-webpack.config.js",
              "mergeStrategies": { "module.rules": "prepend" }
            },
...

"serve": {
          "builder": "@angular-builders/custom-webpack:dev-server",
...

extra-webpack.config.js

const path = require("path");

module.exports = {
  resolve: {
    alias: {
      "@styles": path.resolve(__dirname, "src/scss/"),
    },
  },
};