解决antd的样式加载问题

在用create-react-app搭建的项目中直接使用antd的时候会发祥组件是没有样式的,我们需要在webpack配置这种做一些修改:
webpack.config.dev.js:

{
            test: /\.(js|jsx|mjs)$/,
            include: paths.appSrc,
            loader: require.resolve('babel-loader'),
            options: {
              plugins: [  
                ['import', { libraryName: 'antd', style: 'css' }]  // `style: true` 会加载 less 文件  
              ],
              // This is a feature of `babel-loader` for webpack (not Babel itself).
              // It enables caching results in ./node_modules/.cache/babel-loader/
              // directory for faster rebuilds.
              cacheDirectory: true,
            },
          },

webpack.config.prod.js:

 {
            test: /\.(js|jsx|mjs)$/,
            include: paths.appSrc,
            loader: require.resolve('babel-loader'),
            options: {
              plugins: [  
                ['import', { libraryName: 'antd', style: 'css' }]  // `style: true` 会加载 less 文件  
              ],
              compact: true,
            },
          },

你可能感兴趣的:(解决antd的样式加载问题)