postcss-loader和importLoaders

最新推荐文章于 2024-08-13 08:31:03 发布

麦子的小库存

最新推荐文章于 2024-08-13 08:31:03 发布

阅读量242

点赞数

分类专栏： Webpack 文章标签： postcss css javascript

本文链接：https://blog.csdn.net/qq_36162529/article/details/121695399

版权

Webpack 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

css文件中如果有@import 语句，importLoaders的作用是决定@import模块在使用css-loader前，要使用几个其它的loaders处理。
postcss-loader解决css兼容性问题

{
  test: /\.css$/,
  use: [
    'style-loader',
    {
      loader: 'css-loader',
      options: {
        importLoaders: 1, /* 在这之前还需加载几个loader */
        /*
        url: true, // 启用/禁用url解析，比如background-image: url(./jupeng.jpg)
        import: true, // 是否允许或者说禁用@import语法处理，比如@import "base.css"
        module: false, // 是否允许css模块化
        sourceMap: false, // 是否生成sourcemap
        esModule: false // 是否将css生成为ES Module的模块对象
        */
      }
    },
    {
      loader: 'postcss-loader',
      options: {
        postcssOptions: {
          plugins: [
            require('autoprefixer')
          ]
        }
      }
    }
  ]
}

/* 测试代码 */
:fullscreen {
  width: auto;
}