webpack混入全局样式的两种方式

Posted 前端精髓

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了webpack混入全局样式的两种方式相关的知识,希望对你有一定的参考价值。

如果你使用 stylus 预处理器,默认支持 import 混入一些全局样式。


  test: /\\.styl(us)?$/,
  use: [
    MpxWebpackPlugin.wxssLoader(),
    
      loader: 'stylus-loader',
      options: 
        stylusOptions: 
          import: [resolve('./src/theme.styl')],
        
      
    
  ]

除此之外,还可以选择安装 style-resources-loader 进行处理样式。


  test: /\\.styl(us)?$/,
  use: [
    MpxWebpackPlugin.wxssLoader(),
    'stylus-loader',
    
      loader: 'style-resources-loader',
      options: 
        patterns: [
          resolve('./src/theme.styl')
        ]
      
    
  ]

以上是关于webpack混入全局样式的两种方式的主要内容,如果未能解决你的问题,请参考以下文章

webpack安装以及打包的两种方式

webpack测试打包文件的两种方式

vue书写样式的两种方式

vue优雅使用技巧(一)

javascript教程系列40:DOM中操作样式的两种方式

vue中修改element ui组件默认样式的两种方式