@tmsfe/tmskit 0.0.1

package/main.js

@@ -0,0 +1,3 @@
+#!/usr/bin/env node
+
+require('./dist/index.cjs'); // eslint-disable-line

package/package.json

@@ -0,0 +1,72 @@
+{
+  "name": "@tmsfe/tmskit",
+  "version": "0.0.1",
+  "description": "tmskit",
+  "main": "main.js",
+  "bin": {
+    "tmskit": "main.js"
+  },
+  "scripts": {
+    "dev": "rollup -wc --environment TARGET:tmskit",
+    "build": "rollup -c --environment TARGET:tmskit"
+  },
+  "author": "tms·web",
+  "license": "ISC",
+  "buildOptions": {
+    "formats": [
+      "cjs"
+    ]
+  },
+  "devDependencies": {
+    "@babel/core": "^7.15.0",
+    "@babel/plugin-transform-modules-commonjs": "^7.16.0",
+    "@babel/preset-env": "^7.16.0",
+    "@rollup/plugin-babel": "^5.0.2",
+    "@rollup/plugin-commonjs": "^19.0.0",
+    "@rollup/plugin-dynamic-import-vars": "^1.1.1",
+    "@rollup/plugin-json": "^4.0.3",
+    "async": "^3.2.2",
+    "babel-core": "^6.26.3",
+    "babel-loader": "^8.2.3",
+    "copy-webpack-plugin": "^9.1.0",
+    "cross-env": "^7.0.3",
+    "leven": "3.1.0",
+    "metalsmith": "^2.3.0",
+    "minimist": "^1.2.5",
+    "rollup": "^2.6.1",
+    "rollup-plugin-node-resolve": "^5.2.0",
+    "rollup-plugin-terser": "^6.1.0",
+    "rollup-plugin-typescript2": "0.27.0",
+    "ts-loader": "^9.2.6",
+    "url-loader": "^4.1.1",
+    "webpack": "^5.64.0",
+    "webpack-cli": "^4.9.1"
+  },
+  "dependencies": {
+    "axios": "^0.21.4",
+    "chalk": "^4.1.0",
+    "commander": "^6.2.1",
+    "download-git-repo": "^3.0.2",
+    "ejs": "^3.1.5",
+    "file-loader": "^6.2.0",
+    "fs-extra": "^9.0.1",
+    "inquirer": "^7.3.3",
+    "lodash": "^4.17.21",
+    "mini-css-extract-plugin": "^2.4.5",
+    "miniprogram-ci": "1.4.13",
+    "ora": "^5.1.0",
+    "replace-ext": "^2.0.0",
+    "rollup-plugin-replace": "^2.2.0",
+    "shelljs": "^0.8.4",
+    "tslib": "^1.14.1",
+    "typescript": "^3.8.3",
+    "username": "5.1.0",
+    "webpack-chain": "^6.5.1"
+  },
+  "engines": {
+    "node": "^12.17.0 || >= 14.0.0"
+  },
+  "jest": {
+    "testEnvironment": "jest-environment-node"
+  }
+}

package/rollup.config.js

@@ -0,0 +1,179 @@
+import path from 'path';
+import ts from 'rollup-plugin-typescript2';
+import babel from '@rollup/plugin-babel';
+import json from '@rollup/plugin-json';
+import replace from 'rollup-plugin-replace';
+import nodeResolve from 'rollup-plugin-node-resolve';
+import commonjs from '@rollup/plugin-commonjs';
+
+if (!process.env.TARGET) {
+  throw new Error('TARGET package must be specified via --environment flag.');
+}
+
+// 指定包地址
+const packageDir = path.resolve(__dirname);
+// 包名
+const name = path.basename(packageDir);
+// 环境
+const interEnv = process.env.INTER_ENV || 'public';
+
+// eslint-disable-next-line
+const packageJson = require('./package.json');
+
+const packageOptions = packageJson.buildOptions || {};
+
+function resolve(name) { // eslint-disable-line
+  return path.resolve(packageDir, name);
+}
+
+const outputConfig = {
+  esm: {
+    dir: resolve('dist'),
+    entryFileNames: '[name].js',
+    format: 'es',
+  },
+  'esm-browser': {
+    dir: resolve('dist'),
+    entryFileNames: '[name].esm-browser.js',
+    format: 'es',
+  },
+  cjs: {
+    dir: resolve('dist'),
+    entryFileNames: '[name].cjs.js',
+    format: 'cjs',
+  },
+  global: {
+    dir: resolve('dist'),
+    entryFileNames: '[name].global.js',
+    format: 'iife',
+  },
+};
+
+const defaultFormats = ['esm'];
+// 打包格式
+const packageFormats = packageOptions.formats || defaultFormats;
+
+const packageConfigs = packageFormats.map(format => createConfig(format, outputConfig[format]));
+
+export default packageConfigs;
+
+/**
+ * format rollup package configuration object
+ * @param {string} format 文件打包格式
+ * @param {object} output 输出对象
+ * @param {array} plugins 插件
+ * @returns {object} rollup配置对象
+ */
+function createConfig(format, output, plugins = []) {
+  if (!output) {
+    // eslint-disable-next-line
+    console.log(require('chalk').yellow(`invalid format: "${format}"`));  // eslint-disable-line no-console
+    process.exit(1);
+  }
+
+  output.sourceMap = true;  // eslint-disable-line
+  output.externalLiveBindings = false;  // eslint-disable-line
+
+  // 兼容不同的包的入口文件 -- 后面会统一为index.ts
+  const entryFile = setEntryFile(name);
+
+  // 定制化cjs的插件和esmodule的插件。
+  const extralPlugin = setEsPlugin(output.format);
+
+  return {
+    input: entryFile,
+    output,
+    external: [],
+    plugins: [
+      json({
+        namedExports: false,
+      }),
+      commonjs({
+        ignoreDynamicRequires: true,
+        // include: 'node_modules/**', // Default: undefined
+        browser: true,
+      }),
+      babel({
+        plugins: ['@babel/plugin-proposal-nullish-coalescing-operator', '@babel/plugin-proposal-optional-chaining'],
+        // exclude: ['node_modules/**'],
+      }),
+      // terser(),
+      createReplacePlugin(),
+      ...extralPlugin,
+      ...plugins,
+    ],
+    onwarn: (msg, warn) => {
+      if (!/Circular/.test(msg)) {
+        warn(msg);
+      }
+    },
+    treeshake: {
+      moduleSideEffects: false,
+    },
+  };
+}
+
+/**
+ * 兼容现在的包会存在不同入口的情况。 后面会统一为index.ts
+ * @param {  string } packageName 包名称
+ * @returns { Object } entryFile
+ */
+function setEntryFile(packageName) {
+  let entryFile = resolve('src/index.js');
+
+  switch (packageName) {
+    case 'tms-core':
+      entryFile = {
+        index: resolve('src/index'),
+        request: resolve('src/request'),
+        cloudService: resolve('src/cloudService'),
+      };
+      if (interEnv !== 'public') {
+        entryFile['index-proxy'] = resolve('src/index-proxy');
+      }
+      break;
+    case 'tms-websdk':
+      entryFile = resolve('src/index.ts');
+      break;
+    default:
+      entryFile = resolve('src/index.js');
+  };
+
+  return entryFile;
+}
+
+/**
+ * 定制化cjs和esmodule的插件
+ * @param { string } format 打包格式
+ * @returns { Array<plugin> } 插件数组
+ */
+function setEsPlugin(format) {
+  const extralPlugins = [];
+
+
+  if (format.indexOf('es') > -1) {
+    extralPlugins.push(ts({
+      tsconfig: resolve('tsconfig.json'),
+    }));
+  };
+  if (format.indexOf('iife') > -1) {
+    extralPlugins.push(nodeResolve({ jsnext: true, preferBuiltins: true, browser: true }));
+  }
+  return extralPlugins;
+}
+
+/**
+ * 创建变量替换插件
+ * @returns {function} 插件函数
+ */
+function createReplacePlugin() {
+  const replacements = {
+    tmsCore: interEnv === 'public' ? '@tmsfe/tms-core' : '@tmsfe/tms-core',
+    INTER_ENV_VB: JSON.stringify(interEnv || 'private'),
+  };
+
+  return replace({
+    values: replacements,
+    preventAssignment: true,
+  });
+}

package/src/config/constant.js

@@ -0,0 +1,65 @@
+const path = require('path');
+
+// 用户目录
+const HOME_DIR =  process.env.HOME;
+
+// 所有文件的缓存目录
+const CACHE_DIR = path.resolve(HOME_DIR, '.tmskit');
+
+// 脚手架模板代码所在目录
+const TEMPLATE_DIR = path.resolve(CACHE_DIR, 'template');
+
+// 第三方模块源码存放的临时缓存目录
+const MODULE_CODE_DIR = path.resolve(CACHE_DIR, 'modules_code');
+
+// 脚手架模板代码的具体路径
+const TEMPLATE_PATH = path.resolve(TEMPLATE_DIR, 'tools/tms-cli-template');
+
+// 脚手架的名称
+const TMS_NAME = 'tmskit';
+
+// 脚手架的配置名称
+const TMS_CONFIG_FILENAME = 'tms.config.js';
+
+
+// 模块代码的默认在modules子目录
+const DEFAULT_MODULE_DIR = 'modules';
+
+// 模块的配置文件的名称
+const MODULE_CONFIG_FILENAME = 'module.config.json';
+
+// 默认的webpack entry
+const DEFAULT_WEBPACK_ENTRY = {
+  app: path.resolve(process.cwd(), 'app'),
+};
+
+// 默认从源码拷贝到编译后的配置
+const DEFAULT_COPY_CONFIG = ['package.json', 'app.js', 'app.ts', 'app.less', 'app.wxss', 'sitemap.json'];
+
+// 开发模式
+const MODE = {
+  main: 'tkitmain',
+  all: 'all',
+  multi: 'multi',
+};
+
+const ENV = {
+  dev: 'development',
+  prod: 'production',
+};
+
+export {
+  HOME_DIR,
+  CACHE_DIR,
+  TEMPLATE_DIR,
+  TEMPLATE_PATH,
+  TMS_NAME,
+  TMS_CONFIG_FILENAME,
+  DEFAULT_MODULE_DIR,
+  MODULE_CONFIG_FILENAME,
+  DEFAULT_WEBPACK_ENTRY,
+  DEFAULT_COPY_CONFIG,
+  MODULE_CODE_DIR,
+  MODE,
+  ENV,
+};

package/src/config/defaultTmsConfig.js

@@ -0,0 +1,17 @@
+// tmsConfig默认配置项
+module.exports = {
+  // 全局的环境配置项
+  envData: {},
+  // 模块配置信息
+  modules: [],
+  webpack: {
+    /** 编译输出文件夹位置 */
+    outputDir: 'dist',
+    /** 源码监听路径 */
+    sourceDir: './',
+    /** 源码Map */
+    sourceMap: 'none',
+    /** 别名 */
+    alias: {},
+  },
+};

package/src/entry.js

@@ -0,0 +1,20 @@
+module.exports = [
+  {
+    command: 'create <app-name>',
+    description: '创建新的应用',
+    action: (appName, cmd) => {
+      require('./scripts/create')(appName, cmd);
+    },
+  },
+  {
+    command: 'run <command-name>',
+    options: [
+      ['-m, --module [moduleName]', '模块名称'],
+      ['-e, --env [env]', '环境变量'],
+    ],
+    description: '运行模块',
+    action: (commandName, cmd) => {
+      require('./scripts/run/index')(commandName, cmd);
+    },
+  },
+];

package/src/index.js

@@ -0,0 +1,47 @@
+const chalk = require('chalk');
+const program = require('commander');
+const { log, suggestCommands } = require('./utils/widgets');
+const { TMS_NAME } = require('./config/constant.js');
+const commands = require('./entry');
+const init = require('./init');
+
+init();
+
+program
+  .version(`${TMS_NAME} ${require('../package.json').version}`);
+
+commands.forEach((cmd) => {
+  const command = program.command(cmd.command);
+
+  cmd.usage && command.usage(cmd.usage);
+
+  cmd.description && command.description(cmd.description);
+
+  cmd.options?.forEach(opt => command.option(...opt));
+
+  command.action(cmd.action);
+});
+
+program.on('--help', () => {
+  log();
+  log(`  Run ${chalk.cyan('tms <command> --help')} for detailed usage of given command.`);
+  log();
+});
+
+// 捕获未注册的命令
+program
+  .arguments('<command>')
+  .action((cmd) => {
+    program.outputHelp();
+    log(`  ${chalk.red(`Unknown command ${chalk.yellow(cmd)}.`)}`);
+    log();
+    suggestCommands(cmd);
+    process.exitCode = 1;
+  });
+
+if (!process.argv.slice(2).length) {
+  program.outputHelp();
+  process.exit(-1);
+}
+
+program.parse(process.argv);

package/src/init.js

@@ -0,0 +1,38 @@
+const { exec } = require('shelljs');
+const semver = require('semver');
+const packageJson = require('../package.json');
+const chalk = require('chalk');
+const { log } = require('./utils/widgets');
+
+const requiredVersion = packageJson.engines.node;
+const packName = packageJson.name;
+
+/**
+ * 检查node版本
+ * @param {String} wanted 希望的node版本
+ * @param {String} id 某node特性
+ * @returns {Undefined} 无需返回值
+ */
+const checkNodeVersion = (wanted, id) => {
+  if (!semver.satisfies(process.version, wanted, { includePrerelease: true })) {
+    log(chalk.red(`你正在使用的Node版本： ${process.version}, 但是此版本的 ${id
+    } 需要的Node最小版本 ${wanted}.\n请先升级你的Node版本.`));
+    process.exit(1);
+  }
+};
+
+/**
+ * 检查运行环境
+ * @returns {Undefined} 无需返回值
+ */
+function initCliContext() {
+  // 执行操作前检查node版本
+  // 旧版本node直接提示升级，退出脚本
+  checkNodeVersion(requiredVersion, packName);
+
+
+  // 执行前配置正确的npm源
+  exec('npm config set registry https://mirrors.tencent.com/npm/ --global', { silent: true });
+}
+
+module.exports = initCliContext;

package/src/scripts/create/ask.js

@@ -0,0 +1,61 @@
+const fs = require('fs');
+const inquirer = require('inquirer');
+/**
+ * 获取模板内的问题
+ * @param {string} templateDir 模板目录
+ * @returns {Array} inquirer 问题数组
+ */
+const parseTemplateQuestions = (templateDir) => {
+  let prompts = [];
+  if (!fs.existsSync(`${templateDir}/questions.json`)) {
+    return prompts;
+  }
+  try {
+    const json = JSON.parse(fs.readFileSync(`${templateDir}/questions.json`));
+    if (Array.isArray(json) && json.length > 0) {
+      json.forEach((item, index) => {
+        if (!isQuestionType(item)) {
+          throw new Error(`第 ${index} 个问题不符合"inquirer"的格式要求`);
+        }
+      });
+    } else {
+      throw new Error('问题文件只能是数组');
+    }
+    prompts = json;
+  } catch (err) {
+    throw new Error(`模板异常，${err.message}`);
+  }
+  return prompts;
+};
+const isQuestionType = (result) => {
+  if (!('message' in result)) {
+    return false;
+  }
+  if (!('name' in result)) {
+    return false;
+  }
+  return true;
+};
+
+const ask = templateDir => (files, metalsmith, next) => {
+  const prompts = parseTemplateQuestions(templateDir);
+  const metadata = metalsmith.metadata();
+  const filteredPrompts = prompts.filter((prompt) => {
+    if (metadata[prompt.name] && `${metadata[prompt.name]}`.trim() !== '') {
+      return false;
+    }
+    return true;
+  });
+  inquirer.prompt(filteredPrompts)
+    .then((res) => {
+      for (const prompt of filteredPrompts) {
+        metadata[prompt.name] = res[prompt.name];
+      }
+      next();
+    })
+    .catch((err) => {
+      next(err);
+    });
+};
+
+module.exports = ask;

package/src/scripts/create/generator.js

@@ -0,0 +1,27 @@
+const Metalsmith = require('metalsmith');
+const fs = require('fs');
+const render = require('./render');
+const ask = require('./ask');
+const FILES_TO_IGNORE = require('./ignoreFiles');
+
+
+const generator = (buildDir, distDir, preMetadata) => new Promise((resolve, reject) => {
+  Metalsmith(buildDir)
+    .metadata(preMetadata)
+    .ignore(FILES_TO_IGNORE)
+    .clean(false)
+    .use(ask(buildDir))
+    .source('./')
+    .destination(distDir)
+    .use(render)
+    .build((err) => {
+      if (err) {
+        reject(err);
+      } else {
+        fs.unlinkSync(`${distDir}/questions.json`);
+        resolve('finish');
+      }
+    });
+});
+
+module.exports = generator;

package/src/scripts/create/ignoreFiles.js

@@ -0,0 +1,7 @@
+
+// 在metal smith遍历时需要忽略的文件，这些文件会引起metalsmith的parse error
+const FILES_TO_IGNORE = [
+  'node_modules',
+];
+
+module.exports = FILES_TO_IGNORE;

package/src/scripts/create/index.js

@@ -0,0 +1,65 @@
+const path = require('path');
+const fs = require('fs');
+const shelljs = require('shelljs');
+const { TEMPLATE_DIR, TEMPLATE_PATH } = require('../../config/constant.js');
+const { downloadRepoForGit, createTask, resolve } = require('../../utils/widgets');
+const io = require('../../utils/io');
+const { fail, succeed } = require('../../utils/log');
+const generator = require('./generator');
+
+/**
+ * 如果该目录下面存在文件，换个名字
+ * @param { string } targetDir 当前文件夹
+ * @returns { undefined }
+ */
+async function createAppDir(targetDir) {
+  // 如果目录非空或者已经存在，提示用户，做选择
+  if (fs.existsSync(targetDir)) {
+    if (!await io.isDirEmpty(targetDir)) {
+      fail('该目录名已经存在，换个项目名字吧~');
+      process.exit(1);
+    }
+  } else {
+    shelljs.mkdir('-p', targetDir);
+  }
+}
+
+/**
+ * 创建本地小程序运行环境
+ * @param { string } appType 项目类型
+ * @param { string } appName 项目名称
+ */
+async function create(appName) {
+  const cwd = process.cwd();
+  const targetDir = path.resolve(cwd, appName);
+  const appType = 'mp';
+  createAppDir(targetDir);
+
+  // 创建缓存目录
+  io.ensureDirExist(TEMPLATE_DIR);
+  // 拉取git模板
+  await createTask(downloadRepoForGit, '拉取模板仓库', '拉取模板仓库完成')(
+    'https://git.woa.com/tmsfe/tms-frontend.git',
+    TEMPLATE_DIR,
+    'master',
+  );
+
+  // 生成模板(1. 询问问题， 2. ejs生成模板  3.生成到目标目录)
+  generator(path.join(TEMPLATE_PATH, appType), targetDir, {
+    appName,
+    appType,
+  }).then(() => {
+    succeed('项目创建完成，开始初始化...');
+    shelljs.cd(appName);
+    // 初始化构件主包的代码， 让用户打开项目可以跑起来
+    if (fs.existsSync(resolve(`${appName}/tms.config.js`))) {
+      shelljs.exec('tmskit run build');
+    }
+  })
+    .catch((err) => {
+      fail(err.message);
+      console.log('详细的错误信息:', err);
+    });
+}
+
+module.exports = create;

package/src/scripts/create/render.js

@@ -0,0 +1,19 @@
+
+const async = require('async');
+const ejs = require('ejs');
+
+const render = (files, metalsmith, next) => {
+  const keys = Object.keys(files);
+  const metadata = metalsmith.metadata();
+  const run = (file, next) => {
+    const str = files[file].contents.toString();
+    const newStr = ejs.render(str, metadata);
+    // eslint-disable-next-line
+    files[file].contents = Buffer.from(newStr);
+    next();
+  };
+
+  async.each(keys, run, next);
+};
+
+module.exports = render;

package/src/scripts/run/build/index.js

@@ -0,0 +1,16 @@
+const shelljs = require('shelljs');
+const webpackBuildServer = require('../../../webpack/buildServer');
+const { resolve } = require('../../../utils/widgets');
+const init = require('../init/index');
+
+async function build(tmsConfig, targetModules, env) {
+  // 开始构建前，清理输出目录
+  await shelljs.rm('-rf', resolve('dist'));
+
+  const { targetModules: newModules } = await init(tmsConfig, targetModules);
+
+  webpackBuildServer(tmsConfig, newModules, env);
+}
+
+module.exports = build;
+