Почему псевдоним webpack не работает?

Question

Я использую webpack и postcss-import в своем проекте. Я пишу компоненты, а некоторые компоненты могут быть вложены в другой, поэтому сложно написать путь для них, например, import '../../../component-a'; и так далее. Я хочу создать псевдоним для решения этой проблемы. Так что в моем webpack.config.js я написал:

resolve: { 
     alias: { 
      '@blocks': path.resolve(__dirname, './source/blocks'), 
      '@styles': path.resolve(__dirname, './source/styles') 

my webpack config расположен в корне. Итак, проблема в том, что я пишу в css что-то вроде @import '@styles/vars.css'; - это не работает. Я получаю en error 'undefined variable bla bla bla ...'. Но когда я импортирую блоки внутри js-файлов и пишу import Logo from '@blocks/logo'; - он работает отлично. Также я хочу заметить, что @import '@styles/vars.css'; - работает с стилусом. Так что, возможно, я пропустил что-то о плагине postcss-import. Как это сделать?

UPD postcss конфигурации часть:

`` `

var webpack = require("webpack"); 

function postcssModules() { 
    return [ 
     require('postcss-nested')(), 
     require('postcss-import')({ 
      addDependencyTo: webpack 
     }), 
     require('postcss-simple-vars'), 
     require('postcss-cssnext')({ 
      warnForDuplicates: false 
     }), 
     require('lost') 
    ] 
}; 

module.exports = postcssModules; 

` ``

Answer 1

Может быть, это может помочь (я ответил там):

https://github.com/postcss/postcss-import/issues/190#issuecomment-298078092 https://github.com/postcss/postcss-import/issues/187#issuecomment-298078080

Если вы хотите, чтобы t о псевдониме повторного использования WebPack, в замене

const resolver = ResolverFactory.createResolver({ 
    alias: { 
    '@blabla': path.resolve(__dirname, 'src') 
    }, 
    extensions: ['.css'], 
    modules: ['src', 'node_modules'], 
    useSyncFileSystemCalls: true, 
    fileSystem 
}); 

с

const webpackBaseConfig = require('./webpack.config.base').default; 

const resolver = ResolverFactory.createResolver(
Object.assign({}, 
    webpackBaseConfig.resolve, { 
    modules: ['src', 'node_modules'], 
    useSyncFileSystemCalls: true, 
    fileSystem 
    }) 
);