akfun 5.1.21 → 5.2.1

package/module/index.js

@@ -142,33 +142,41 @@ let argv = yargs
   )
   .command(
     'build2lib',
-    '构建lib库',
+    '构建 Library 库（UMD 模块）',
     (yargs) => {
       yargs
         .reset()
         .usage(titleTip('Usage') + ': $0 build2lib')
         .alias('h', 'help');
     },
-    (argv) => {
+    () => {
       mainAction.build('lib'); // 构建library
     },
   )
   .command(
     'build2esm',
-    '构建esm模块',
+    '构建 ESM 模块',
     (yargs) => {
       yargs
         .reset()
         .usage(titleTip('Usage') + ': $0 build2esm')
-        .option('fileName', {
-          alias: 'n',
-          describe: '输出的文件名',
-          default: '',
-        })
         .alias('h', 'help');
     },
-    (argv) => {
-      mainAction.build2esm(argv.fileName); // 构建esm
+    () => {
+      mainAction.build2esm();
+    },
+  )
+  .command(
+    'build2node',
+    '构建 Node 模块',
+    (yargs) => {
+      yargs
+        .reset()
+        .usage(titleTip('Usage') + ': $0 build2node')
+        .alias('h', 'help');
+    },
+    () => {
+      mainAction.build2node();
     },
   )
   .command(

package/module/main.js

@@ -2,6 +2,7 @@
 const buildAction = require('../src/build.js'); // 构建脚本：生产环境
 const devAction = require('../src/dev-server.js'); // 构建脚本：开发环境
 const build2esm = require('../src/build2esm.js'); // 构建esm输出模块
+const build2node = require('../src/build2node.js'); // 构建esm输出模块
 const inspect = require('./inspect.js');
 const gitClone = require('../src/utils/gitClone.js');
 const createFile = require('../src/utils/createFile');
@@ -21,6 +22,7 @@ module.exports = {
   dev: devAction,
   build: buildAction,
   build2esm,
+  build2node,
   inspect,
   
   // 工具方法

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "akfun",
-  "version": "5.1.21",
+  "version": "5.2.1",
   "description": "前端脚手架：支持Vue技术栈和react技术栈",
   "keywords": [
     "前端工程",

package/src/build2esm.js

@@ -1,80 +1,38 @@
-const ora = require('ora');
-const rollup = require('rollup');
-const terser = require('@rollup/plugin-terser'); // 压缩
 const getProjectConfig = require('./config/index'); // 用于获取当前项目配置文件
-const rollupConfig = require('./config/rollup.config'); // rollup的配置文件
-const { isArray, isObject } = require('./utils/typeof');
 const { curConsoleTag } = require('./utils/akfunParams');
-
-async function build2esmFunc(options, curConfig) {
-  // create a bundle
-  const bundle = await rollup.rollup({
-    input: options.input,
-    external: options.external || options.externals, // 兼容新旧两种写法
-    plugins: options.plugins
-  });
-
-  if (isArray(options.output)) {
-    // 等待所有输出完成
-    await Promise.all(options.output.map((outputItem) => bundle.write(outputItem)));
-  } else if (isObject(options.output)) {
-    // or write the bundle to disk
-    await bundle.write(options.output);
-  }
-
-  // 关闭 bundle 以释放资源
-  await bundle.close();
-}
+const rollupBuild = require('./rollup/build');
+const rollupConfig = require('./rollup/rollup.config'); // rollup的配置文件
+/**
+ * 用于构建 esm 模块
+ * @param {*} akfunConfig akfun 配置文件
+ * @param {*} _consoleTag 控制台输出标签
+ * 
+ *  * 支持的配置项目（akfunConfig.build2esm）
+ * - type: 项目构建类型（ts、js）
+ * - format: 构建格式（esm、cjs）
+ * - input: 构建入口文件
+ * - fileName: 构建输出文件名
+ * - outDir: 构建输出目录
+ * - excludeList: 构建排除列表
+ * - declaration: 是否生成声明文件
+ * - declarationDir: 声明文件输出目录
+ * - svgDir: svg文件输出目录
+ * - plugins: 自定义rollup插件
+ * - babelPlugins: 自定义babel插件
+ */
 
 // 构建脚本：一般用于构建生产环境的代码
-module.exports = function (fileName, akfunConfig, _consoleTag) {
+module.exports = function (akfunConfig, _consoleTag) {
   const consoleTag = _consoleTag || curConsoleTag;
   // 获取项目配置文件
   let config = getProjectConfig(akfunConfig);
-
-  const spinner = ora(`${consoleTag}开启esm模块构建能力...`).start();
-  const curRollupConfig = rollupConfig(fileName, config); // 默认配置
   const build2esm = config.build2esm; // 用户的项目配置
-  const curWebpackConfig = config.webpack;
-  const compress = build2esm.compress ?? true; // 是否压缩代码
-  if (build2esm && build2esm.input) {
-    curRollupConfig.input = build2esm.input;
-  }
 
-  // 处理 externals，用户手动添加要剔除的依赖
-  let externals = []; // rollup 的 externals 是数组格式
+  const curRollupConfig = rollupConfig(config, build2esm); // 默认配置
 
-  const webpackExternal = curWebpackConfig.external;
-  if (webpackExternal && isArray(webpackExternal)) {
-    externals = externals.concat(webpackExternal);
-  } else if (webpackExternal && isObject(webpackExternal)) {
-    externals = externals.concat(Object.keys(webpackExternal));
+  if (build2esm && !build2esm.format) {
+    build2esm.format = 'esm'; // 默认构建格式为 esm
   }
 
-  const build2esmExternal = build2esm.external;
-  if (build2esmExternal && isArray(build2esmExternal)) {
-    externals = externals.concat(build2esmExternal);
-  } else if (build2esmExternal && isObject(build2esmExternal)) {
-    externals = externals.concat(Object.keys(build2esmExternal));
-  }
-
-  // 添加到 rollup 配置中（rollup 使用 external 而不是 externals）
-  curRollupConfig.external = externals;
-
-  if (build2esm && build2esm.output) {
-    curRollupConfig.output = build2esm.output;
-
-    if (isArray(build2esm.output)) {
-      build2esm.output.map((outputItem) => {
-        if (!outputItem.plugins && compress) {
-          outputItem.plugins = [terser()];
-        }
-      });
-    } else if (isObject(build2esm.output) && !build2esm.output.plugins && compress) {
-      build2esm.output.plugins = [terser()];
-    }
-  }
-  build2esmFunc(curRollupConfig, config).then(() => {
-    spinner.succeed(`${consoleTag}esm模块构建完成。`);
-  });
+  rollupBuild(config, build2esm, curRollupConfig, consoleTag);
 };

package/src/build2node.js

@@ -0,0 +1,32 @@
+const getProjectConfig = require('./config/index'); // 用于获取当前项目配置文件
+const { curConsoleTag } = require('./utils/akfunParams');
+const rollupBuild = require('./rollup/build');
+const rollupConfig = require('./rollup/rollup.node.config'); // rollup的配置文件
+/**
+ * 用于构建 esm 模块
+ * @param {*} akfunConfig akfun 配置文件
+ * @param {*} _consoleTag 控制台输出标签
+ * 
+ * 支持的配置项目（akfunConfig.build2node）
+ * - type: 项目构建类型（ts、js）
+ * - input: 构建入口文件
+ * - fileName: 构建输出文件名
+ * - outDir: 构建输出目录
+ * - excludeList: 构建排除列表
+ * - declaration: 是否生成声明文件
+ * - declarationDir: 声明文件输出目录
+ */
+
+// 构建脚本：一般用于构建生产环境的代码
+module.exports = function (akfunConfig, _consoleTag) {
+  const consoleTag = _consoleTag || curConsoleTag;
+  // 获取项目配置文件
+  let config = getProjectConfig(akfunConfig);
+  const build2node = config.build2node; // 用户的项目配置
+
+  const curRollupConfig = rollupConfig(config, build2node); // 默认配置
+
+  build2node.format = 'cjs'; // 构建格式固定为 cjs，无需用户配置
+
+  rollupBuild(config, build2node, curRollupConfig, consoleTag);
+};

package/src/rollup/build.js

@@ -0,0 +1,83 @@
+const ora = require('ora');
+const rollup = require('rollup');
+const terser = require('@rollup/plugin-terser'); // 压缩
+const { isArray, isObject } = require('../utils/typeof');
+const { curConsoleTag } = require('../utils/akfunParams');
+
+async function rollupBuildFunc(envConfig, curConfig) {
+  // create a bundle
+  const bundle = await rollup.rollup({
+    input: envConfig.input,
+    external: envConfig.external || envConfig.externals, // 兼容新旧两种写法
+    plugins: envConfig.plugins
+  });
+
+  if (isArray(envConfig.output)) {
+    // 等待所有输出完成
+    await Promise.all(envConfig.output.map((outputItem) => bundle.write(outputItem)));
+  } else if (isObject(envConfig.output)) {
+    // or write the bundle to disk
+    await bundle.write(envConfig.output);
+  }
+
+  // 关闭 bundle 以释放资源
+  await bundle.close();
+}
+
+/**
+ * 用于构建 node 模块
+ * @param {*} config: akfun 配置文件
+ * @param {*} envConfig: 当前环境配置
+ * @param {*} _rollupConfig: 自定义 rollup 配置
+ * @param {*} _consoleTag 控制台输出标签
+ */
+module.exports = function (config, envConfig, _rollupConfig, _consoleTag) {
+  const consoleTag = _consoleTag || curConsoleTag;
+  const curRollupConfig = _rollupConfig;
+  const curWebpackConfig = config.webpack;
+  const buildFormat = envConfig.format || 'esm';
+  const compress = envConfig.compress ?? true; // 是否压缩代码
+  if (envConfig && envConfig.input) {
+    curRollupConfig.input = envConfig.input;
+  }
+
+  // 处理 externals，用户手动添加要剔除的依赖
+  let externals = []; // rollup 的 externals 是数组格式
+
+  const webpackExternals = curWebpackConfig.externals || curWebpackConfig.external;
+  if (webpackExternals && isArray(webpackExternals)) {
+    externals = externals.concat(webpackExternals);
+  } else if (webpackExternals && isObject(webpackExternals)) {
+    externals = externals.concat(Object.keys(webpackExternals));
+  }
+
+  const curExternal = envConfig.external;
+  if (curExternal && isArray(curExternal)) {
+    externals = externals.concat(curExternal);
+  } else if (curExternal && isObject(curExternal)) {
+    externals = externals.concat(Object.keys(curExternal));
+  }
+
+  // 添加到 rollup 配置中（rollup 使用 external 而不是 externals）
+  curRollupConfig.external = externals;
+
+  if (envConfig && envConfig.output) {
+    curRollupConfig.output = envConfig.output;
+
+    if (compress &&isArray(envConfig.output)) {
+      envConfig.output.map((outputItem) => {
+        if (!outputItem.plugins) {
+          outputItem.plugins = [terser()];
+        } else {
+          outputItem.plugins.push(terser());
+        }
+      });
+    } else if (compress && isObject(envConfig.output) && !envConfig.output.plugins) {
+      envConfig.output.plugins = [terser()];
+    }
+  }
+  const spinner = ora(`${consoleTag}开启${buildFormat}模块构建模式...`).start();
+  rollupBuildFunc(curRollupConfig, config).then(() => {
+    spinner.succeed(`${consoleTag}${buildFormat}模块构建完成。`);
+  });
+};

package/src/{config → rollup}/rollup.config.js

@@ -23,24 +23,40 @@ const cssnano = require('cssnano');
 const svgr = require('@svgr/rollup');
 const { nodeExternals } = require('rollup-plugin-node-externals');
 const { resolveToCurrentRoot, resolveToCurrentDist } = require('../utils/pathUtils'); // 统一路径解析
-const babelConfig = require('./babel.config'); // Babel的配置文件
-const projectConfig = require('./index'); // 引入当前项目配置文件
+const babelConfig = require('../config/babel.config'); // Babel的配置文件
 const { buildBanner } = require('../utils/akfunParams');
 
-module.exports = function (fileName, akfunConfig) {
-  const curConfig = akfunConfig || projectConfig;
-  const build2esm = curConfig.build2esm || {};
+/**
+ * 用于生成 rollup 配置
+ * @param {*} curConfig 当前项目配置
+ * @param {*} curEnvConfig 当前环境配置
+ * 
+ * 支持的配置项目（curEnvConfig）
+ * - type: 项目构建类型（ts、js）
+ * - format: 构建格式（esm、cjs）
+ * - input: 构建入口文件
+ * - fileName: 构建输出文件名
+ * - outDir: 构建输出目录
+ * - excludeList: 构建排除列表
+ * - declaration: 是否生成声明文件
+ * - declarationDir: 声明文件输出目录
+ * - svgDir: svg文件输出目录
+ * - plugins: 自定义rollup插件
+ * - babelPlugins: 自定义babel插件
+ */
+module.exports = function (curConfig, curEnvConfig) {
   const curWebpackConfig = curConfig.webpack || {};
-  const buildType = build2esm.type || 'ts';
+  const buildType = curEnvConfig.type || 'ts';
+  const buildFormat = curEnvConfig.format || 'esm';
   // 获取用户配置的构建入口文件
   let rollupInput = resolveToCurrentRoot('src/main.js');
-  if (build2esm.input) {
-    rollupInput = build2esm.input;
+  if (curEnvConfig.input) {
+    rollupInput = curEnvConfig.input;
   }
-  let curFileName = fileName || 'index'; // 默认以"index.esm.js"输出
+  let curFileName = 'index'; // 默认以"index.esm.js"输出
   // 获取用户配置的构建输出文件名
-  if (build2esm.fileName) {
-    curFileName = build2esm.fileName;
+  if (curEnvConfig.fileName) {
+    curFileName = curEnvConfig.fileName;
   }
   // 增加babel配置
   babelConfig.babelHelpers = 'runtime';
@@ -53,7 +69,6 @@ module.exports = function (fileName, akfunConfig) {
 
   return {
     banner: buildBanner,
-    // format: build2esm.format || 'esm', // 生成包的格式
     input: rollupInput,
     plugins: [
       alias({
@@ -69,7 +84,7 @@ module.exports = function (fileName, akfunConfig) {
        * 设置打包中应该排除的依赖
        */
       nodeExternals({
-        include: build2esm.excludeList || []
+        include: curEnvConfig.excludeList || []
         // exclude: ['./**', '../**'], // 排除所有相对路径模块
         // deps: true, // 只标记 node_modules 中的依赖
         // devDeps: false, // 不标记 devDependencies
@@ -87,12 +102,11 @@ module.exports = function (fileName, akfunConfig) {
       buildType === 'ts'
         ? typescript({
             // 是否生成声明文件（默认 false）
-            declaration: build2esm.declaration !== undefined ? build2esm.declaration : false,
-            declarationDir: build2esm.declarationDir || './dist/types'
+            declaration: curEnvConfig.declaration !== undefined ? curEnvConfig.declaration : false,
+            declarationDir: curEnvConfig.declarationDir || './dist/types'
           })
         : undefined,
       babel(babelConfig), // 备注，需要先babel()再commjs()
-      // jsx( {factory: 'React.createElement'} ),
       buildType === 'ts' ? undefined : jsx({ factory: 'React.createElement' }),
       vue(),
       commonjs({
@@ -103,7 +117,7 @@ module.exports = function (fileName, akfunConfig) {
       postcss({
         extensions: ['.css', '.scss', '.sass', '.styl', '.stylus', '.less'],
         // Or with custom file name, it will generate file relative to bundle.js in v3
-        extract: resolveToCurrentDist(`${curFileName}.css`, build2esm.outDir),
+        extract: resolveToCurrentDist(`${curFileName}.css`, curEnvConfig.outDir),
         plugins: [
           simplevars(),
           nested(),
@@ -121,18 +135,18 @@ module.exports = function (fileName, akfunConfig) {
         dimensions: false
       }),
       image({
-        exclude: [build2esm.svgDir || 'src/icons/**']
+        exclude: [curEnvConfig.svgDir || 'src/icons/**']
       }),
       json()
     ],
     output: [
       {
-        file: resolveToCurrentDist(`${curFileName}.esm.js`, build2esm.outDir),
-        format: 'esm'
+        file: resolveToCurrentDist(`${curFileName}.${buildFormat}.js`, curEnvConfig.outDir),
+        format: buildFormat
       },
       {
-        file: resolveToCurrentDist(`${curFileName}.esm.min.js`, build2esm.outDir),
-        format: 'esm',
+        file: resolveToCurrentDist(`${curFileName}.${buildFormat}.min.js`, curEnvConfig.outDir),
+        format: buildFormat,
         plugins: [terser()]
       }
     ]

package/src/rollup/rollup.node.config.js

@@ -0,0 +1,87 @@
+// rollup.config.js
+const { nodeResolve } = require('@rollup/plugin-node-resolve'); // 支持node中的文件导入
+const typescript = require('@rollup/plugin-typescript'); // 支持ts
+const commonjs = require('@rollup/plugin-commonjs'); // 识别cmd模块
+const json = require('@rollup/plugin-json'); // 识别json类型文件
+const alias = require('@rollup/plugin-alias'); // 简写配置
+const { nodeExternals } = require('rollup-plugin-node-externals');
+const { resolveToCurrentRoot, resolveToCurrentDist } = require('../utils/pathUtils'); // 统一路径解析
+const { buildBanner } = require('../utils/akfunParams');
+const { resolve } = require('../utils/pathUtils'); // 统一路径解析
+
+/**
+ * 用于生成构建 node 模块的 rollup 配置
+ * 备注：node 模块构建不需要使用 babel，也不需要处理css、图片、svg 等文件。
+ * @param {*} curConfig 当前项目配置
+ * @param {*} curEnvConfig 当前环境配置
+ * 
+ * 支持的配置项目（curEnvConfig）
+ * - type: 项目构建类型（ts、js）
+ * - format: 构建格式（esm、cjs）
+ * - input: 构建入口文件
+ * - fileName: 构建输出文件名
+ * - outDir: 构建输出目录
+ * - excludeList: 构建排除列表
+ * - declaration: 是否生成声明文件
+ * - declarationDir: 声明文件输出目录
+ */
+module.exports = function (curConfig, curEnvConfig) {
+  const buildFormat = curEnvConfig.format || 'cjs';
+  const buildType = curEnvConfig.type || 'ts';
+  const curWebpackConfig = curConfig.webpack || {};
+
+  let rollupInput = resolveToCurrentRoot('src/main.js'); // 默认入口文件为 src/main.js
+  if (curEnvConfig.input) {
+    rollupInput = curEnvConfig.input;
+  }
+
+  let curFileName = 'index'; // 默认以"index.esm.js"输出
+  // 获取用户配置的构建输出文件名
+  if (curEnvConfig.fileName) {
+    curFileName = curEnvConfig.fileName;
+  }
+
+  return {
+    banner: buildBanner,
+    input: rollupInput,
+    plugins: [
+      alias({
+        entries: Object.entries(curWebpackConfig.resolve.alias || {}).map(
+          ([find, replacement]) => ({
+            find,
+            replacement
+          })
+        )
+      }),
+      nodeExternals({
+        include: curEnvConfig.excludeList || []
+      }),
+      nodeResolve({
+        extensions: curWebpackConfig.resolve.extensions
+      }),
+      buildType === 'ts'
+        ? typescript({
+            // 是否生成声明文件（默认 false）
+            declaration: curEnvConfig.declaration !== undefined ? curEnvConfig.declaration : false,
+            declarationDir: curEnvConfig.declarationDir || './dist/types'
+          })
+        : undefined,
+      commonjs({
+        transformMixedEsModules: true, // 转换混合的 ES 模块和 CommonJS 模块
+        strictRequires: true, // 严格模式处理 require，确保所有 require 都被正确处理
+        ignoreDynamicRequires: true // 忽略动态 require
+      }),
+      json()
+    ],
+    output: {
+      dir: resolve('dist'),
+      format: buildFormat, // which can be one of "amd", "cjs", "system", "es", "iife" or "umd".
+      preserveModules: true, // 关键：保留原始模块结构，不合并文件
+      preserveModulesRoot: 'src', // 指定模块根目录
+      exports: 'auto', // 自动处理导出（适配 ES 模块的默认导出/命名导出）
+      generatedCode: 'es2015', // 使用现代 JavaScript 语法生成代码
+      entryFileNames: '[name].js',
+      // interop: 'auto' // 自动处理 CJS/ES 模块互操作（如 __esModule 标记）
+    },
+  };
+};

package/src/webpack/webpack.base.conf.js

@@ -250,7 +250,7 @@ module.exports = (_curEnvConfig, _akfunConfig, buildMode = 'build') => {
     allowList = allowList.concat(curEnvConfig.allowList);
   }
   // 用户手动添加要剔除的依赖
-  let externals = curWebpackConfig.external || {};
+  let externals = curWebpackConfig.externals || curWebpackConfig.external || {};
   if (curEnvConfig.externals && isObject(curEnvConfig.externals)) {
     externals = Object.assign(externals, curEnvConfig.externals);
   }