在react项目中不能直接引入antd.css文件,引入会报警告./node_modules/antd/dist/antd.css (./node_modules/css-loader??ref-

解决的方法是在webpack.config.dev.js和webpack.config.prod.js文件添加相关配置,然后引入antd.less:

const cssRegex = /\.(css|less)$/;
const cssModuleRegex = /\.module\.css$/;
const sassRegex = /\.(scss|sass)$/;
const sassModuleRegex = /\.module\.(scss|sass)$/;
const stylusRegex = /\.styl$/;
const stylusModuleRegex = /\.module\.styl$/;

// common function to get style loaders
const getStyleLoaders = (cssOptions, preProcessor) => {
  const loaders = [
    require.resolve('style-loader'),
    {
      loader: require.resolve('css-loader'),
      options: cssOptions,
    },
    {
      loader:'less-loader',
      options:{
        javascriptEnabled:true
      }
    },

在项目的app.js文件里全局引入antd.less

你可能感兴趣的:(前端笔记)