использовать конфигурацию postcss webpack в файле конфигурации vue через chainWebpack - PullRequest
Новая
       28

использовать конфигурацию postcss webpack в файле конфигурации vue через chainWebpack

0 голосов
/ 29 октября 2019

Как мне перевести следующий код конфигурации, чтобы он работал с chainWebpack в файле vue.config.js?
(Это рекомендуемая конфигурация, взятая из документации vue-loader ) 

// webpack.config.js -> module.rules
{
  test: /\.css$/,
  use: [
    'vue-style-loader',
    {
      loader: 'css-loader',
      options: { importLoaders: 1 }
    },
    'postcss-loader'
  ]
}

Я придумал следующий код - но, похоже, сначала полностью запускается загрузчик "обычного" стиля: 

chainWebpack: config => {
  config.module
    .rule('postcss')
    .test(/\.css$/)

    .use('vue-style-loader')
    .tap(options =>
      _merge(options, {
        importLoaders: 1,
      }),
    )
    .loader('postcss-loader');

Похоже, что файл css скомпилирован в файл javascript до того, как postcss его прочитает, что приводит к множественным ошибкам, подобным этой: 

 error  in ./node_modules/vue-airbnb-style-datepicker/dist/vue-airbnb-style-datepicker.min.css

Syntax Error: SyntaxError

(1:4) Unknown word

> 1 | // style-loader: Adds some css to the DOM by adding a <style> tag
    |    ^
  2 |
  3 | // load the styles
...