Блог

Я хочу использовать @ngneat / tailwind, это схема для изменения проекта angular в проект с пользовательской конфигурацией webpack.

После добавления, что все мои пути импорта scss о шрифтах или других частичных scss не разрешены, и я получаю сообщение об ошибке:

 Error: Failed to find 'filename'
 

Если в моем angular.json я удаляю пользовательский веб-пакет:

 "customWebpackConfig": {
              "path": "webpack.config.js"
            }
 

все пути отлично работают.

У меня есть конфигурация приложения Angular версии 11 по умолчанию.

Как я могу разрешить эти пути?

Я пытался с помощью webpack разрешить псевдоним, но это не работает:

 const webpackMerge = require('webpack-merge');
const path = require('path');

console.error(path.resolve(__dirname, 'src/assets/ds/abstract/_variables.scss'));


module.exports = (config) => {
  const merge = webpackMerge amp;amp; webpackMerge.merge ? webpackMerge.merge : webpackMerge;
  const isProd = config.mode === 'production';
  const tailwindConfig = require('./tailwind.config.js')(isProd);

  return merge(config, {
    module: {
      rules: [
        {
          test: /.scss$/,
          loader: 'postcss-loader',
          options: {
            postcssOptions: {
              ident: 'postcss',
              syntax: 'postcss-scss',
              plugins: [
                require('postcss-import'),
                require('tailwindcss')(tailwindConfig),
                require('autoprefixer')
              ]
            }
          }
        }
      ]
    },
    resolve: {
      alias: {
        variables: path.resolve(__dirname, 'src/assets/ds/abstract/_variables.scss')
      },
      extensions: ['.ts', '.js', 'scss']
    }
  });
};
 

Это была проблема. Начиная с версии 5.1.0, это также работает.