ant-design-pro引用css

ant-design-pro中默認只能引用less文件,引用了css文件也是無效的。因此須要在配置文件config.js中找到css

 cssLoaderOptions,在 getLocalIdent中加入能夠引用css文件的方法:context.resourcePath.includes('.css')
代碼以下:
cssLoaderOptions: {
    modules: true,
    getLocalIdent: (context, localIdentName, localName) => {
      if (
        context.resourcePath.includes('node_modules') || context.resourcePath.includes('.css') ||
        context.resourcePath.includes('ant.design.pro.less') ||
        context.resourcePath.includes('global.less')
      ) {
        return localName;
      }
      const match = context.resourcePath.match(/src(.*)/);
      if (match && match[1]) {
        const antdProPath = match[1].replace('.less', '');
        const arr = slash(antdProPath)
          .split('/')
          .map(a => a.replace(/([A-Z])/g, '-$1'))
          .map(a => a.toLowerCase());
        return `antd-pro${arr.join('-')}-${localName}`.replace(/--/g, '-');
      }
      return localName;
    },
  },
相關文章
相關標籤/搜索