akfun 1.5.17 → 1.6.1

package/module/index.js

@@ -129,7 +129,7 @@ let argv = yargs
   )
   .command(
     'build',
-    '构建生产环境的代码',
+    '构建生产环境代码',
     (yargs) => {
       yargs
         .reset()
@@ -142,7 +142,7 @@ let argv = yargs
   )
   .command(
     'build2lib',
-    '构建第三方功能包',
+    '构建lib库',
     (yargs) => {
       yargs
         .reset()
@@ -155,7 +155,7 @@ let argv = yargs
   )
   .command(
     'build2esm',
-    '构建esm功能包',
+    '构建esm模块',
     (yargs) => {
       yargs
         .reset()

package/module/inspect.js

@@ -1,10 +1,11 @@
 const path = require('path');
 const ora = require('ora');
 const fs = require('fs');
+const {curConsoleTag} = require("../src/utils/akfunParams");
 const getCurWebpackConfig = require('../src/utils/getCurWebpackConfig.js'); // 用于获取当前webpack配置的方法
 
 // 根据当前配置文件内容创建指定名称的文件
-const createConfigJs = function (fileCont, fileName) {
+const createConfigJs = function (fileName, fileCont) {
   let filePath = path.resolve(process.cwd(), fileName);
 
   fs.writeFile(filePath, JSON.stringify(fileCont, null, 2), (err) => {
@@ -17,22 +18,23 @@ const createConfigJs = function (fileCont, fileName) {
 /**
  * 用于输出当前项目配置文件
  */
-module.exports = (type) => {
-  const spinner = ora(  '[akfun]正在获取当前环境的配置数据...').start();
+module.exports = (type, _consoleTag) => {
+  const consoleTag = _consoleTag || curConsoleTag;
+  const spinner = ora(  `${consoleTag}正在获取当前环境的配置数据...`).start();
   if (type === 'dev') {
     const devConfig = getCurWebpackConfig(type);
-    createConfigJs(devConfig, 'current-akfun-dev-config.js');
-    spinner.succeed(  '[akfun]当前配置数据已输出至akfun-dev-config.js中！');
+    createConfigJs('current-akfun-dev-config.js', devConfig);
+    spinner.succeed(  `${consoleTag}当前配置数据已输出至akfun-dev-config.js中！`);
   } else if (type === 'lib') {
     const libraryConfig = getCurWebpackConfig(type);
-    createConfigJs(libraryConfig, 'current-akfun-build2lib-config.js');
-    spinner.succeed(  '[akfun]当前配置数据已输出至akfun-build2lib-config.js中！');
+    createConfigJs('current-akfun-build2lib-config.js', libraryConfig);
+    spinner.succeed(  `${consoleTag}当前配置数据已输出至akfun-build2lib-config.js中！`);
   } else if (type === 'build') {
     const prodConfig = getCurWebpackConfig(type);
     // 默认输出生产环境的配置文件
-    createConfigJs(prodConfig, 'current-akfun-build-config.js');
-    spinner.succeed(  '[akfun]当前配置数据已输出至akfun-build-config.js中！');
+    createConfigJs('current-akfun-build-config.js', prodConfig);
+    spinner.succeed(  `${consoleTag}当前配置数据已输出至akfun-build-config.js中！`);
   } else {
-    console.log(`不能识别type=${type}。`)
+    spinner.fail(`${consoleTag}type不能为空。`);
   }
 };

package/module/main.js

@@ -2,11 +2,24 @@
 const buildAction = require('../src/build.js'); // 构建脚本：生产环境
 const devAction = require('../src/dev-server.js'); // 构建脚本：开发环境
 const build2esm = require('../src/build2esm.js'); // 构建esm输出模块
+const inspect = require('./inspect.js');
+const gitClone = require('../src/utils/gitClone.js');
+const createFile = require('../src/utils/createFile');
+const {resolve} = require('../src/utils/pathUtils');
+const getConfigObj = require('../src/utils/getConfigObj');
+const deepMergeConfig = require('../src/utils/deepMergeConfig');
 const getCurWebpackConfig = require('../src/utils/getCurWebpackConfig.js'); // 用于获取当前webpack配置的方法
 
 module.exports = {
   dev: devAction,
   build: buildAction,
   build2esm,
+  inspect,
+  gitClone,
+  createFile,
+  resolve,
+  getConfigObj,
+  deepMergeConfig,
+  getCurWebpackConfig,
   curWebpackBaseConfPath: getCurWebpackConfig('base'),
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "akfun",
-  "version": "1.5.17",
+  "version": "1.6.1",
   "description": "前端脚手架：支持Vue技术栈和react技术栈",
   "keywords": [
     "前端工程",
@@ -73,7 +73,6 @@
     "@rollup/plugin-node-resolve": "^9.0.0",
     "@typescript-eslint/eslint-plugin": "^3.9.0",
     "@typescript-eslint/parser": "^3.9.0",
-    "eslint-config-prettier": "^7.2.0",
     "@vue/compiler-sfc": "^3.0.0-rc.10",
     "@vue/eslint-config-typescript": "^5.0.2",
     "autoprefixer": "^9.8.0",
@@ -92,6 +91,7 @@
     "es6-promise-polyfill": "^1.2.0",
     "eslint": "^7.2.0",
     "eslint-config-airbnb-base": "^14.1.0",
+    "eslint-config-prettier": "^7.2.0",
     "eslint-friendly-formatter": "^4.0.1",
     "eslint-import-resolver-webpack": "^0.12.1",
     "eslint-loader": "^4.0.2",
@@ -112,6 +112,7 @@
     "http-proxy-middleware": "^1.0.4",
     "inquirer": "^7.3.3",
     "mini-css-extract-plugin": "^0.9.0",
+    "monaco-editor-webpack-plugin": "6.0.0",
     "node-sass": "^4.14.1",
     "opn": "^6.0.0",
     "optimize-css-assets-webpack-plugin": "^5.0.3",
@@ -152,8 +153,8 @@
     "webpack-dev-middleware": "^3.7.2",
     "webpack-hot-middleware": "^2.25.0",
     "webpack-merge": "^4.2.2",
-    "yargs": "^12.0.2",
-    "webpack-node-externals": "^3.0.0"
+    "webpack-node-externals": "^3.0.0",
+    "yargs": "^12.0.2"
   },
   "devDependencies": {
     "@commitlint/cli": "^8.3.5",

package/src/build.js

@@ -3,27 +3,31 @@ const rm = require('rimraf');
 const path = require('path');
 const chalk = require('chalk');
 const webpack = require('webpack');
+const {curConsoleTag} = require("./utils/akfunParams");
 const checkVersion = require('./check-versions');
 const projectConfig = require('./config/index'); // 引入当前项目配置文件
+const defaultConfig = require('./config/default.config');
 const deepMergeConfig = require('./utils/deepMergeConfig');
 
 // 构建脚本：一般用于构建生产环境的代码
-module.exports = function (BuildType, akfunConfig) {
+module.exports = function (BuildType, akfunConfig, _consoleTag) {
+  const consoleTag = _consoleTag || curConsoleTag;
   let config = projectConfig; // 默认使用执行命令目录下的配置数据
   if (akfunConfig) {
+    // 参数中的config配置优先级最高
     config = deepMergeConfig(defaultConfig, akfunConfig);
   }
   // 检查当前npm版本号是否匹配
   checkVersion();
-  const spinner = ora('[akfun]开启AKFun构建能力...').start();
+  const spinner = ora(`${consoleTag}开始构建...`).start();
   // 引入生产环境配置信息
   let webpackConfig;
   // 根据BuildType判断是否引用专用于第三方功能包的webpack配置
   if (BuildType && BuildType === 'lib') {
-    spinner.start('[akfun]开始构建第三方功能包...');
+    spinner.start(`${consoleTag}开始构建lib库...`);
     webpackConfig = require('./webpack/webpack.library.conf')(config);
   } else {
-    spinner.start('[akfun]开始构建生产环境的代码...');
+    spinner.start(`${consoleTag}开始构建生产环境的代码...`);
     webpackConfig = require('./webpack/webpack.prod.conf')(config);
   }
 

package/src/build2esm.js

@@ -1,8 +1,11 @@
 const ora = require('ora');
 const rollup = require('rollup');
-const config = require('./config/index'); // 引入当前项目配置文件
+const projectConfig = require('./config/index'); // 引入当前项目配置文件
+const defaultConfig = require('./config/default.config');
 const rollupConfig = require('./config/rollup.config'); // rollup的配置文件
 const { isArray, isObject } = require('./utils/typeof');
+const {curConsoleTag } = require("./utils/akfunParams");
+const deepMergeConfig = require('./utils/deepMergeConfig');
 
 async function build2esmFunc(options) {
   // create a bundle
@@ -24,8 +27,14 @@ async function build2esmFunc(options) {
 }
 
 // 构建脚本：一般用于构建生产环境的代码
-module.exports = function (fileName) {
-  const spinner = ora('[akfun]开启esm lib库的构建能力...').start();
+module.exports = function (fileName, akfunConfig, _consoleTag) {
+  const consoleTag = _consoleTag || curConsoleTag;
+  let config = projectConfig; // 默认使用执行命令目录下的配置数据
+  if (akfunConfig) {
+    // 参数中的config配置优先级最高
+    config = deepMergeConfig(defaultConfig, akfunConfig);
+  }
+  const spinner = ora(`${consoleTag}开启esm lib库的构建能力...`).start();
   const curRollupConfig = rollupConfig(fileName); // 默认配置
   const build2esm = config.build2esm; // 用户的项目配置
   if (build2esm && build2esm.input) {
@@ -35,6 +44,6 @@ module.exports = function (fileName) {
     curRollupConfig.output = build2esm.output;
   }
   build2esmFunc(curRollupConfig).then(() => {
-    spinner.succeed('[akfun]esm lib库构建完成');
+    spinner.succeed(`${consoleTag}esm lib库构建完成`);
   });
 };

package/src/config/default.config.js

@@ -1,4 +1,3 @@
-'use strict';
 // 统一路径解析：
 const { resolve } = require('../utils/pathUtils');
 

package/src/config/index.js

@@ -1,4 +1,3 @@
-'use strict';
 // 统一路径解析：
 const { resolve } = require('../utils/pathUtils');
 const defaultAKFunConfig = require('./default.config');

package/src/dev-server.js

@@ -11,16 +11,19 @@ const projectConfig = require('./config/index');
 const defaultConfig = require('./config/default.config');
 const getDevWebpackConfig = require('./webpack/webpack.dev.conf');
 const deepMergeConfig = require('./utils/deepMergeConfig');
+const {curConsoleTag } = require("./utils/akfunParams");
 
 // 构建脚本：一般用于构建开发环境的代码（包含热更新、接口代理等功能）
-module.exports = function (akfunConfig) {
+module.exports = function (akfunConfig, _consoleTag) {
+  const consoleTag = _consoleTag || curConsoleTag;
   let config = projectConfig; // 默认使用执行命令目录下的配置数据
   if (akfunConfig) {
+    // 参数中的config配置优先级最高
     config = deepMergeConfig(defaultConfig, akfunConfig);
   }
   // 检查当前npm版本号是否匹配
   checkVersion();
-  const spinner = ora('[akfun]开启调试模式...').start();
+  const spinner = ora(`${consoleTag}开启调试模式...`).start();
   /**
    * 如果 Node 的环境无法判断当前是 dev / product 环境
    * 使用 config.dev.NODE_ENV 作为当前的环境
@@ -112,7 +115,7 @@ module.exports = function (akfunConfig) {
       console.log(`> Listening at ${uri}\n`);
       // 如果是开发环境，自动打开浏览器并跳到项目首页
       if (autoOpenBrowser && process.NODE_ENV === 'development') {
-        spinner.succeed('[akfun]调试模式已开启！');
+        spinner.succeed(`${consoleTag}调试模式已开启！`);
         opn(uri);
       }
       server = app.listen(port);

package/src/initData/config/akfun.config.js

@@ -22,7 +22,7 @@ module.exports = {
     },
     resolve: {
       // webpack的resolve配置
-      extensions: ['.js', '.jsx', '.vue', 'json'], // 用于配置webpack在尝试过程中用到的后缀列表
+      extensions: ['.js', '.jsx', '.ts', '.tsx', '.vue', 'json'], // 用于配置webpack在尝试过程中用到的后缀列表
       alias: {
         '@': resolve('src'),
         $components: resolve('src/components'),
@@ -31,6 +31,8 @@ module.exports = {
         $utils: resolve('src/utils')
       }
     },
+    createDeclaration: false, // 打包时是否创建ts声明文件
+    ignoreNodeModules: false, // 打包时是否忽略 node_modules
     externals: [], // 从输出的 bundle 中排除依赖
     template: resolve('src/index.html'), // 默认使用的页面模板
     sassResources: []

package/src/utils/akfunParams.js

@@ -0,0 +1,12 @@
+var consoleTag = '[akfun]'; // 输出标记
+
+function setConsoleTag(newText) {
+  consoleTag = newText;
+}
+
+module.exports = {
+  get curConsoleTag() {
+    return consoleTag;
+  },
+  setConsoleTag
+};

package/src/utils/getCurWebpackConfig.js

@@ -1,16 +1,16 @@
 /**
  * 用于获取当前项目配置文件
  */
-module.exports = (type) => {
+module.exports = (type, akfunConfig) => {
   let curConfig = {};
   if (type === 'dev') {
-    curConfig = require('../webpack/webpack.dev.conf')();
+    curConfig = require('../webpack/webpack.dev.conf')(akfunConfig);
   } else if (type === 'lib') {
-    curConfig = require('../webpack/webpack.library.conf')();
+    curConfig = require('../webpack/webpack.library.conf')(akfunConfig);
   } else if (type === 'build') {
-    curConfig = require('../webpack/webpack.prod.conf')();
+    curConfig = require('../webpack/webpack.prod.conf')(akfunConfig);
   } else if (type === 'base') {
-    curConfig = require('../webpack/webpack.base.conf')();
+    curConfig = require('../webpack/webpack.base.conf')(akfunConfig);
   }
   return curConfig;
 };

package/src/utils/gitClone.js

@@ -3,9 +3,11 @@ const ora = require('ora');
 const gitclone = require('git-clone');
 const rm = require('rimraf').sync;
 const { resolveToCurrentRoot } = require('../utils/pathUtils');
+const {curConsoleTag} = require("./akfunParams");
 
-function gitClone(gitUrl, dir, callback) {
-  const spinner = ora('[akfun]正在加载项目模板...').start();
+function _gitClone(gitUrl, dir, callback, _consoleTag) {
+  const consoleTag = _consoleTag || curConsoleTag;
+  const spinner = ora(`${consoleTag}正在加载项目模板...`).start();
   gitclone(
     gitUrl,
     resolveToCurrentRoot(dir),
@@ -15,7 +17,7 @@ function gitClone(gitUrl, dir, callback) {
     (err) => {
       if (err === undefined) {
         rm(resolveToCurrentRoot(path.resolve(dir, '.git')));
-        spinner.succeed('[akfun]项目模板加载完成！');
+        spinner.succeed(`${consoleTag}项目模板加载完成！`);
         callback();
       } else {
         console.log(err);
@@ -24,4 +26,4 @@ function gitClone(gitUrl, dir, callback) {
     }
   );
 }
-module.exports = gitClone;
+module.exports = _gitClone;

package/src/webpack/webpack.library.conf.js

@@ -44,7 +44,9 @@ module.exports = (akfunConfig) => {
         'process.env.NODE_ENV': JSON.stringify(curEnvConfig.NODE_ENV)
       }),
       new MiniCssExtractPlugin({
-        filename: utils.assetsPath('index.css'),
+        // filename: utils.assetsPath('index.css'),
+        filename: "[name].css",
+        chunkFilename: "[id].css",
         ignoreOrder: false
       }),
       new OptimizeCSSPlugin({

package/src/webpack/webpack.prod.conf.js

@@ -11,6 +11,7 @@ const CompressionWebpackPlugin = require('compression-webpack-plugin');
 const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin');
 const ProgressBarPlugin = require('progress-bar-webpack-plugin');
 const nodeExternals = require('webpack-node-externals');
+const MonacoWebpackPlugin = require('monaco-editor-webpack-plugin');
 
 const utils = require('./loaderUtils');
 const { resolve } = require('../utils/pathUtils'); // 统一路径解析
@@ -176,6 +177,11 @@ module.exports = (akfunConfig) => {
       })
     );
   }
+  
+  // 是否开启
+  if (curEnvConfig.openMonacoWebpackPlugin) {
+    webpackProdConfig.plugins.push(new MonacoWebpackPlugin());
+  }
 
   if (curEnvConfig.bundleAnalyzerReport) {
     webpackProdConfig.plugins.push(new BundleAnalyzerPlugin());