px2rem-loader @import 引入css 无法编译

Question

Vue中使用lib-flexible + px2rem-loader,外部引入css

<style src='../assets/style.css'>
  /* 能正常转换 */
</style>

<style>
  @import url('../assets/style.css');
  /* 不能转换 */
</style>

<style>
  @import '../assets/style.css';
  /* 不能转换 */
</style>

已经尝试过按照 @冰扬 vue-cli 配置flexible 中所提示的配置importLoaders深度，深度等级从1-10依次尝试，无效

utils.js 配置

const cssLoader = {
  loader: 'css-loader',
  options: {
    sourceMap: options.sourceMap,
      importLoaders: 10
    }
  }
const px2remLoader = {
    loader: 'px2rem-loader',
    options:{
      remUnit:75
    }
  }

function generateLoaders (loader, loaderOptions) {
    const loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader,px2remLoader]
    if (loader) {
      loaders.push({
        loader: loader + '-loader',
        options: Object.assign({}, loaderOptions, {
          sourceMap: options.sourceMap
        })
      })
    }

无效解决办法:(目前看起来这个方式是最靠谱的，但是无效)

1.增加postcss-pxtorem

如何使@import方式引入的样式，成功被px2rem-loader正常转换为rem,感谢各位大神，

Answer 1

额，我写的时候loaders还不是三目运算符，后来更新了，我也没改，前后都加上px2remLoader，就没问题了