React 组件开发 dist 产物规范化

[imsobear]

React 组件目前的 dist/ 没有实际使用，里面存在很多不规范的地方，比如文件命名、依赖等问题，需要整体治理下

[imsobear]

[zuoqi705]

这个大概什么时候能 ready 呢

[imsobear]

@zuoqi705 得下周看了

[jerry-wang12]

dist目录中构建产物的css会包含fusion基础组件样式，希望能排除掉

[ClarkXia]

排除 fusion 基础组件样式进行如下配置即可：

{
  "library": "Test",
  "basicComponents": false,
  "plugins": [
    "build-plugin-component"
  ]
}

目前 externals next 依赖的场景下不能搭配 build-plugin-fusion（内部默认做了组件按需），需要定制 externals 规则

搭配 build-plugin-fusion：

{
  "library": "Test",
  "basicComponents": false,
  "plugins": [
    "build-plugin-component",
    "build-plugin-fusion",
    "./externals-plugin.js"
  ]
}

// externals-plugin.js
const { upperFirst, camelCase } = require('lodash');

module.exports = ({ onGetWebpackConfig}) => {
  onGetWebpackConfig('component-dist', (config) => {
    // 移除 dist 构建上的按需逻辑
    ['jsx', 'tsx'].forEach((rule) => {
      config.module
        .rule(rule)
        .use('babel-loader')
        .tap((options) => {
          const plugins = options.plugins.filter((item) => {
            if (Array.isArray(item) && item[0].includes('babel-plugin-import')) {
              return false;
            }
            return true;
          });
          options.plugins = plugins;
          return options;
        });
    });
  });
}

后续会在 build-plugin-fusion 中进行兼容