同时编译antd和css module,需要设置两次less识别。

{
    test: /\.less$/,
    exclude: path.resolve(__dirname, './node_modules'),
    use: extractTextPlugin.extract({ // 如果编译自己写的less,用css module, 就要过滤antd。
        use: [{
            loader: 'css-loader',
            options: {
            minimize: false,
            modules: true,
            localIdentName: '[name]_[local]_[hash:base64:5]'
            }
        },
        {
            loader: 'less-loader'
        }
        ],
        // use style-loader in development
        fallback: 'style-loader'
    })
},
{
    test: /\.less$/,
    include: path.resolve(__dirname, './node_modules'),
    use: extractTextPlugin.extract({ // 如果编译antd的less,就要全局编译,不加css module。
        use: [{
            loader: 'css-loader'
        },
        {
            loader: `less-loader?{"sourceMap":true,"modifyVars":${JSON.stringify(themer)}}`
        }
        ],
        fallback: 'style-loader'
    })
}

同时使用antd和css module的更多相关文章

  1. react中antd+css Module一起使用

    antd 和 css modules 不能混用,针对antd的css 单独写一条loader的规则,不开启 css modules. 使用 exclude 和 include 配置参考(https:/ ...

  2. Vue中scoped css和css module比较

    scoped css 官方文档 scoped css可以直接在能跑起来的vue项目中使用. 使用方法: <style scoped> h1 { color: #f00; } </st ...

  3. webpack项目轻松混用css module

    前言 本文讲述css-loader开启css模块功能之后,如何与引用的npm包中样式文件不产生冲突. 比如antd-mobilenpm包的引入.在不做特殊处理的前提下,样式文件将会被转译成css mo ...

  4. 如使用Typescript撸Vue(Vue2 + TS +TSX+CSS module)

    Vue对TS的支持一致不太好,连Vue作者尤大也自嘲真香压错了宝.期待Vue3.0会用TS重构且会有较大改进.不过目前有一些第三方的库可以曲线优化对TS的支持.主要就介绍下过下面两个库来写Vue. 总 ...

  5. css module

    来源:CSS Modules 用法教程 后面项目地址:https://github.com/947133297/lwj-webpack-demo 关键是打开这一行,表示开启loader的css mod ...

  6. [React] {svg, css module, sass} support in Create React App 2.0

    create-react-app version 2.0 added a lot of new features. One of the new features is added the svgr  ...

  7. vue css module

    步骤 module <style> -> <style module> class='header' -> :class='$style.header' <t ...

  8. create-react-app 构建的项目使用 css module 方式来书写 css

    先 yarn eject 释放出来配置文件具体参见我之前写过相关的文章(这里不再重复), 找到 config 文件夹下的文件如下图所示: 找到如图所示的配置: 书写 css 的文件名例如(App.mo ...

  9. CSS Module解决全局或本地使用@keyframes无效问题

    最近使用CSSModule开发react项目,遇到一个问题,使用@keyframes无效,问题如下 /** less + css module **/ :global { .effect-bottom ...

随机推荐

  1. 来自多校的一个题——数位DP+卡位

    n<=1e9就要考虑倍增.矩阵乘法这种了 假设L=0 考虑枚举二进制下,所有X与R的LCP长度,前len高位 对于第len+1位,假设R的这一位是1 如果一个x的这一位是0了,那么后面可以随便填 ...

  2. ubuntu16.04+cuda9+cudnn7+tensorflow+pycharm环境搭建

    安装环境:ubuntu16.04+cuda9+cudnn7+tensorflow+pycharm 1)前期搭建过程主要是按照这篇博文,对于版本选择,安装步骤都讲得很详细,亲测有效! https://b ...

  3. MySQL 无法启动,出现 “发生系统错误 1067。”

    出现场景 使用 net start mysql 时无法启动,并出现:发生系统错误 1067. 解决过程 很多情况都可以导致该错误提示,可以先查找 "Windows 日志" : 打开 ...

  4. Gym - 101350E Competitive Seagulls (博弈)

    There are two seagulls playing a very peculiar game. First they line up N unit squares in a line, al ...

  5. 老男孩Python全栈学习 S9 日常作业 006

    1.使用循环打印以下效果: 1: * ** *** **** ***** 2: ***** **** *** ** * 3: * *** ***** ******* ********* for i i ...

  6. java matlab 混合编程 Failed to find the required library mclmcrrt9_2.dll on java.library.path.

    问题描述: Exception in thread "main" java.lang.UnsatisfiedLinkError: Failed to find the requir ...

  7. MySQL学习1 - 基本mysql语句

    一 操作文件夹(数据库) 增 查 改 删 二 操作文件(数据表) 增 查 改 删 三 操作文件内容(数据记录) 增 查 改 删 一 操作文件夹(数据库) 增 create database db1 c ...

  8. CF1153D Serval and Rooted Tree(树形DP)

      题目链接: https://www.luogu.org/problemnew/show/CF1153D (cf崩了,贴了个落谷的) 题目大意:给你n个点,然后n-1条边,构成一棵树,每个点是子节点 ...

  9. pdb调试神器使用终极指南

    pdb为python程序实现了一个交互式调试环境.它包括一些特性,可以暂停程序,查看变量值,以及逐步监视程序执行,从而能了解程序具体做了什么,并查找逻辑中存在的bug. 启动调试工具 使用pdb的第一 ...

  10. (原创)cocos lua 热更新从零开始(一)最简单demo

    开发环境:WIN7 + cocos2dx 3.10 lua版本 0.学习这篇内容的基础是你要会创建并运行一个cocos lua项目 1.热更新的思想所谓的热更新,就是在线更新代码和资源.热更新的过程首 ...