chore: build

build/config/common.js

@@ -15,35 +15,42 @@ import peerDepsExternal from 'rollup-plugin-peer-deps-external'
 export const extensions = ['.js', '.jsx', '.ts', '.tsx']
 const isProd = process.env.NODE_ENV === 'production'
 
-export default {
-  input: path.resolve(__dirname, './src/index.ts'),
-  output: {
-    // 属性有 file format name sourcemap 等
-    // https://www.rollupjs.com/guide/big-list-of-options
-  },
-  plugins: [
-    peerDepsExternal(), // 打包结果不包含 package.json 的 peerDependencies
-    json({
-      compact: true,
-      indent: '  ',
-      preferConst: true,
-    }),
-    typescript({
-      clean: true,
-      tsconfig: path.resolve(__dirname, './tsconfig.json'),
-    }),
-    nodeResolve({
-      browser: true, // 重要
-      // 声明加载 node_module package 时默认使用 package.json 的 main 属性指定的文件
-      // 之前加载 es module，默认不会被处理，导致最后生成的代码有箭头函数
-      mainFields: isProd ? ['main'] : ['module', 'main'],
-      extensions,
-    }),
-    commonjs(),
-    replace({
-      'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV),
-      preventAssignment: true,
-    }),
-    // del({ targets: 'dist/*' }),
-  ],
+/**
+ * 生成 common conf
+ * @param {string} format 'umd' 'esm'
+ * @returns common conf
+ */
+function genCommonConf(format) {
+  return {
+    input: path.resolve(__dirname, './src/index.ts'),
+    output: {
+      // 属性有 file format name sourcemap 等
+      // https://www.rollupjs.com/guide/big-list-of-options
+    },
+    plugins: [
+      peerDepsExternal(), // 打包结果不包含 package.json 的 peerDependencies
+      json({
+        compact: true,
+        indent: '  ',
+        preferConst: true,
+      }),
+      typescript({
+        clean: true,
+        tsconfig: path.resolve(__dirname, './tsconfig.json'),
+      }),
+      nodeResolve({
+        browser: true, // 重要
+        mainFields: format === 'esm' ? ['module', 'main'] : ['main'],
+        extensions,
+      }),
+      commonjs(),
+      replace({
+        'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV),
+        preventAssignment: true,
+      }),
+      // del({ targets: 'dist/*' }),
+    ],
+  }
 }
+
+export default genCommonConf

build/config/dev.js

@@ -5,20 +5,28 @@
 
 import postcss from 'rollup-plugin-postcss'
 import autoprefixer from 'autoprefixer'
-import commonConfig from './common'
+import genCommonConf from './common'
 
-const { input, output = {}, plugins = [], external } = commonConfig
+/**
+ * 生成 dev config
+ * @param {string} format 'umd' 'esm'
+ */
+function genDevConf(format) {
+  const { input, output = {}, plugins = [], external } = genCommonConf(format)
 
-export default {
-  input,
-  output,
-  external,
-  plugins: [
-    ...plugins,
+  return {
+    input,
+    output,
+    external,
+    plugins: [
+      ...plugins,
 
-    postcss({
-      plugins: [autoprefixer()],
-      extract: 'css/style.css',
-    }),
-  ],
+      postcss({
+        plugins: [autoprefixer()],
+        extract: 'css/style.css',
+      }),
+    ],
+  }
 }
+
+export default genDevConf

build/config/prd.js

@@ -9,40 +9,48 @@ import autoprefixer from 'autoprefixer'
 import cssnano from 'cssnano'
 import { terser } from 'rollup-plugin-terser'
 import cleanup from 'rollup-plugin-cleanup'
-import commonConfig from './common'
+import genCommonConf from './common'
 import { extensions } from './common'
 
-const { input, output = {}, plugins = [], external } = commonConfig
+/**
+ * 生成 prd config
+ * @param {string} format 'umd' 'esm'
+ */
+function genPrdConf(format) {
+  const { input, output = {}, plugins = [], external } = genCommonConf(format)
 
-const finalPlugins = [
-  ...plugins,
-  babel({
-    rootMode: 'upward',
-    babelHelpers: 'runtime',
-    exclude: 'node_modules/**',
-    include: 'src/**',
-    extensions,
-  }),
-  postcss({
-    plugins: [
-      autoprefixer(),
-      cssnano(), // 压缩 css
-    ],
-    extract: 'css/style.css',
-  }),
-  cleanup({
-    comments: 'none',
-    extensions: ['.ts', '.tsx'],
-  }),
-  terser(), // 压缩 js
-]
+  const finalPlugins = [
+    ...plugins,
+    babel({
+      rootMode: 'upward',
+      babelHelpers: 'runtime',
+      exclude: 'node_modules/**',
+      include: 'src/**',
+      extensions,
+    }),
+    postcss({
+      plugins: [
+        autoprefixer(),
+        cssnano(), // 压缩 css
+      ],
+      extract: 'css/style.css',
+    }),
+    cleanup({
+      comments: 'none',
+      extensions: ['.ts', '.tsx'],
+    }),
+    terser(), // 压缩 js
+  ]
 
-export default {
-  input,
-  output: {
-    sourcemap: true,
-    ...output,
-  },
-  external,
-  plugins: finalPlugins,
+  return {
+    input,
+    output: {
+      sourcemap: true,
+      ...output,
+    },
+    external,
+    plugins: finalPlugins,
+  }
 }
+
+export default genPrdConf

build/create-rollup-config.js

@@ -5,8 +5,8 @@
 
 import { merge } from 'lodash'
 import { visualizer } from 'rollup-plugin-visualizer'
-import devConf from './config/dev'
-import prdConf from './config/prd'
+import genDevConf from './config/dev'
+import genPrdConf from './config/prd'
 
 // 环境变量
 const ENV = process.env.NODE_ENV || 'production'
@@ -20,12 +20,13 @@ export const IS_PRD = ENV.indexOf('production') >= 0
  */
 export function createRollupConfig(customConfig = {}) {
   const { input, output = {}, plugins = [] } = customConfig
+  const { format } = output
 
   let baseConfig
   if (IS_PRD) {
-    baseConfig = prdConf
+    baseConfig = genPrdConf(format)
   } else {
-    baseConfig = devConf
+    baseConfig = genDevConf(format)
   }
 
   if (IS_SIZE_STATS) {

packages/basic-modules/rollup.config.js

@@ -5,7 +5,7 @@ const name = 'WangEditorBasicModules'
 
 const configList = []
 
-// esm - 开发环境不需要 CDN 引入，只需要 npm 引入，所以优先输出 esm
+// esm
 const esmConf = createRollupConfig({
   output: {
     file: pkg.module,
@@ -15,16 +15,14 @@ const esmConf = createRollupConfig({
 })
 configList.push(esmConf)
 
-if (IS_PRD) {
-  // umd
-  const umdConf = createRollupConfig({
-    output: {
-      file: pkg.main,
-      format: 'umd',
-      name,
-    },
-  })
-  configList.push(umdConf)
-}
+// umd
+const umdConf = createRollupConfig({
+  output: {
+    file: pkg.main,
+    format: 'umd',
+    name,
+  },
+})
+configList.push(umdConf)
 
 export default configList

packages/code-highlight/rollup.config.js

@@ -5,7 +5,7 @@ const name = 'WangEditorCodeHighLight'
 
 const configList = []
 
-// esm - 开发环境不需要 CDN 引入，只需要 npm 引入，所以优先输出 esm
+// esm
 const esmConf = createRollupConfig({
   output: {
     file: pkg.module,
@@ -15,16 +15,14 @@ const esmConf = createRollupConfig({
 })
 configList.push(esmConf)
 
-if (IS_PRD) {
-  // umd
-  const umdConf = createRollupConfig({
-    output: {
-      file: pkg.main,
-      format: 'umd',
-      name,
-    },
-  })
-  configList.push(umdConf)
-}
+// umd
+const umdConf = createRollupConfig({
+  output: {
+    file: pkg.main,
+    format: 'umd',
+    name,
+  },
+})
+configList.push(umdConf)
 
 export default configList

packages/core/rollup.config.js

@@ -5,7 +5,7 @@ const name = 'WangEditorCore'
 
 const configList = []
 
-// esm - 开发环境不需要 CDN 引入，只需要 npm 引入，所以优先输出 esm
+// esm
 const esmConf = createRollupConfig({
   output: {
     file: pkg.module,
@@ -15,16 +15,14 @@ const esmConf = createRollupConfig({
 })
 configList.push(esmConf)
 
-if (IS_PRD) {
-  // umd
-  const umdConf = createRollupConfig({
-    output: {
-      file: pkg.main,
-      format: 'umd',
-      name,
-    },
-  })
-  configList.push(umdConf)
-}
+// umd
+const umdConf = createRollupConfig({
+  output: {
+    file: pkg.main,
+    format: 'umd',
+    name,
+  },
+})
+configList.push(umdConf)
 
 export default configList

packages/editor/rollup.config.js

@@ -5,7 +5,7 @@ const name = 'wangEditor'
 
 const configList = []
 
-// umd - 开发环境需要 CDN 引入方式来测试，所以优先输出 umd
+// umd
 const umdConf = createRollupConfig({
   output: {
     file: pkg.main,
@@ -15,16 +15,14 @@ const umdConf = createRollupConfig({
 })
 configList.push(umdConf)
 
-if (IS_PRD) {
-  // esm
-  const esmConf = createRollupConfig({
-    output: {
-      file: pkg.module,
-      format: 'esm',
-      name,
-    },
-  })
-  configList.push(esmConf)
-}
+// esm
+const esmConf = createRollupConfig({
+  output: {
+    file: pkg.module,
+    format: 'esm',
+    name,
+  },
+})
+configList.push(esmConf)
 
 export default configList

packages/list-module/rollup.config.js

@@ -15,16 +15,14 @@ const esmConf = createRollupConfig({
 })
 configList.push(esmConf)
 
-if (IS_PRD) {
-  // umd
-  const umdConf = createRollupConfig({
-    output: {
-      file: pkg.main,
-      format: 'umd',
-      name,
-    },
-  })
-  configList.push(umdConf)
-}
+// umd
+const umdConf = createRollupConfig({
+  output: {
+    file: pkg.main,
+    format: 'umd',
+    name,
+  },
+})
+configList.push(umdConf)
 
 export default configList

packages/table-module/rollup.config.js

@@ -5,7 +5,7 @@ const name = 'WangEditorTableModule'
 
 const configList = []
 
-// esm - 开发环境不需要 CDN 引入，只需要 npm 引入，所以优先输出 esm
+// esm
 const esmConf = createRollupConfig({
   output: {
     file: pkg.module,
@@ -15,16 +15,14 @@ const esmConf = createRollupConfig({
 })
 configList.push(esmConf)
 
-if (IS_PRD) {
-  // umd
-  const umdConf = createRollupConfig({
-    output: {
-      file: pkg.main,
-      format: 'umd',
-      name,
-    },
-  })
-  configList.push(umdConf)
-}
+// umd
+const umdConf = createRollupConfig({
+  output: {
+    file: pkg.main,
+    format: 'umd',
+    name,
+  },
+})
+configList.push(umdConf)
 
 export default configList

packages/upload-image-module/rollup.config.js

@@ -5,7 +5,7 @@ const name = 'WangEditorUploadImageModule'
 
 const configList = []
 
-// esm - 开发环境不需要 CDN 引入，只需要 npm 引入，所以优先输出 esm
+// esm
 const esmConf = createRollupConfig({
   output: {
     file: pkg.module,
@@ -15,16 +15,14 @@ const esmConf = createRollupConfig({
 })
 configList.push(esmConf)
 
-if (IS_PRD) {
-  // umd
-  const umdConf = createRollupConfig({
-    output: {
-      file: pkg.main,
-      format: 'umd',
-      name,
-    },
-  })
-  configList.push(umdConf)
-}
+// umd
+const umdConf = createRollupConfig({
+  output: {
+    file: pkg.main,
+    format: 'umd',
+    name,
+  },
+})
+configList.push(umdConf)
 
 export default configList

packages/video-module/rollup.config.js

@@ -5,7 +5,7 @@ const name = 'WangEditorVideoModule'
 
 const configList = []
 
-// esm - 开发环境不需要 CDN 引入，只需要 npm 引入，所以优先输出 esm
+// esm
 const esmConf = createRollupConfig({
   output: {
     file: pkg.module,
@@ -15,16 +15,14 @@ const esmConf = createRollupConfig({
 })
 configList.push(esmConf)
 
-if (IS_PRD) {
-  // umd
-  const umdConf = createRollupConfig({
-    output: {
-      file: pkg.main,
-      format: 'umd',
-      name,
-    },
-  })
-  configList.push(umdConf)
-}
+// umd
+const umdConf = createRollupConfig({
+  output: {
+    file: pkg.main,
+    format: 'umd',
+    name,
+  },
+})
+configList.push(umdConf)
 
 export default configList