@tmsfe/tmskit 0.0.5-beta.1 → 0.0.5-beta.5

package/src/gulp/plugins/mpWxmlDep.js

@@ -0,0 +1,194 @@
+/* eslint-disable no-param-reassign */
+const through = require('through2');
+const htmlparser2 = require('htmlparser2');
+const fs = require('fs');
+const path = require('path');
+const { diffContentCopyFile, ext, fileInDir } = require('../../utils/io');
+const { resolve } = require('../../utils/widgets');
+const { dfsFindCommonDep } = require('./mpCommonDep');
+const { pluginError } = require('./utils/pluginError');
+
+// 处理后缀(源码引入依赖时，不带后缀的情况)
+const extFile = function (name, file) {
+  const extMap = {
+    import: '.wxml',
+    include: '.wxml',
+    wxs: '.wxs',
+  };
+  let extObj = {};
+
+  if (Object.keys(extMap).indexOf(name) > -1 && !file.endsWith(extMap[name])) {
+    extObj = ext(file, [extMap[name]]);
+  }
+  return {
+    extPath: extObj.extPath || '',
+    ext: extObj.ext || '',
+    file: extObj.file || file,
+  };
+};
+
+const dfsFindWxmlDep = function (anaFileOriginFile, anaFileDestFile, isWatch = true) {
+  const resDep = {
+    image: new Map(),
+    wxml: new Map(),
+    wxs: new Map(),
+  };
+  function dfs(anaFileOriginFile, anaFileDestFile) {
+    let contents = '';
+    try {
+      contents = fs.readFileSync(anaFileOriginFile, 'utf8');
+    } catch (e) {
+      pluginError(e, isWatch);
+    }
+    const parser = new htmlparser2.Parser({
+      onopentag(name, attributes) {
+        if (attributes?.src?.startsWith('.')) {
+          const depOriginPath = path.join(path.dirname(anaFileOriginFile), attributes.src);
+          // 被依赖文件加上后缀
+          const { ext, file: depOriginFile, extPath } = extFile(name, depOriginPath);
+
+          if (!fs.existsSync(depOriginFile)) {
+            pluginError(
+              new Error(`${anaFileOriginFile}引用的路径${depOriginFile}找不到应用文件，请检查引用路径`),
+              isWatch,
+            );
+            return;
+          }
+
+          const depDestPath = path.join(path.dirname(anaFileDestFile), attributes.src);
+          const depDestFile = depDestPath.endsWith(ext) ? depDestPath : depDestPath + extPath;
+
+          // 收集wxml依赖
+          if (['import', 'include'].indexOf(name) > -1) {
+            resDep.wxml.set(depDestFile, {
+              anaFileOriginFile,
+              anaFileDestFile,
+              depDestFile,
+              depOriginFile,
+            });
+            dfs(depOriginFile, depDestFile);
+          }
+          // 收集image依赖
+          // if (name === 'image') {
+          //   resDep.image.set(attributes.src, {
+          //     anaFileOriginFile,
+          //     anaFileDestFile,
+          //     depDestFile,
+          //     depOriginFile,
+          //   });
+          //   dfs(depOriginFile, depDestFile);
+          // }
+          // 收集wxs依赖
+          if (name === 'wxs') {
+            resDep.wxs.set(depDestFile, {
+              anaFileOriginFile,
+              anaFileDestFile,
+              depDestFile,
+              depOriginFile,
+            });
+            const defs = dfsFindCommonDep(depOriginFile, depDestFile, ['.wxs']);
+            defs.forEach((item, key) => {
+              resDep.wxs.set(key, item);
+            });
+          }
+        }
+      },
+    });
+    parser.write(contents);
+    parser.end();
+  }
+  dfs(anaFileOriginFile, anaFileDestFile);
+
+  return resDep;
+};
+
+function mpWxmlDep(tmsConfig, module, isWatch) {
+  const stream = through.obj(function (file, enc, cb) {
+    // 依赖分析的文件
+    const anaFileOriginFile = file.history[0];
+    const anaFileRelativeModule = path.relative(resolve(module.from), anaFileOriginFile);
+    const anaFileDestFile = resolve(tmsConfig.outputDir, module.to, anaFileRelativeModule);
+
+    if (file.isBuffer()) {
+      let contents = String(file.contents);
+      const copyModules = new Map();
+      const parser = new htmlparser2.Parser({
+        onopentag(name, attributes) {
+          const nameFilter = ['import', 'include', 'wxs'];
+          if (nameFilter.indexOf(name) > -1 && attributes.src) {
+            const depOriginPath = path.join(path.dirname(anaFileOriginFile), attributes.src);
+            // 处理后缀(源码引入依赖时，后缀不全的情况)
+            const { ext, file: depOriginFile, extPath } = extFile(name, depOriginPath);
+
+            Object.keys(tmsConfig.dependencies).forEach((includeName) => {
+              if (attributes.src.indexOf(includeName) > -1) {
+                const includePath = tmsConfig.dependencies[includeName];
+
+                if (!fileInDir(includePath, depOriginFile)) {
+                  pluginError(
+                    new Error(`${anaFileOriginFile}引用路径${depOriginFile}不在${includePath}不在文件夹内, 请检查应用路径`),
+                    isWatch,
+                  );
+                  return;
+                }
+
+                // eslint-disable-next-line
+                const reg = new RegExp(`^(\.\.\/)+.*\/${includeName}\/(.*)`);
+                const regRes = attributes.src.match(reg) || [];
+                if (regRes[2]) {
+                  const depDestPath = resolve(tmsConfig.outputDir, module.to, includeName, regRes[2]);
+                  const depDestFile = depDestPath.endsWith(ext) ? depDestPath : depDestPath + extPath;
+                  if (!copyModules.has(depDestFile)) {
+                    copyModules.set(depDestFile, {
+                      depOriginFile,
+                      depDestFile,
+                      beforeDepPath: attributes.src,
+                      afterDepPath: path.relative(path.dirname(anaFileDestFile), depDestFile),
+                    });
+                  }
+                }
+              }
+            });
+          }
+        },
+      });
+      parser.write(contents);
+      parser.end();
+
+      // console.log('wxml copyModules', copyModules);
+      copyModules.forEach(({ depOriginFile, depDestFile, beforeDepPath, afterDepPath }) => {
+        if (fs.existsSync(depOriginFile)) {
+          diffContentCopyFile(depOriginFile, depDestFile);
+          const reg = new RegExp(`['"]${beforeDepPath}["']`, 'g');
+          contents = contents.replace(reg, `"${afterDepPath}"`);
+        }
+        if (depOriginFile.endsWith('.wxml')) {
+          const defs = dfsFindWxmlDep(depOriginFile, depDestFile, isWatch);
+          // console.log('wxml defs', defs);
+          [...defs.wxml, ...defs.wxs].forEach(([, item]) => {
+            diffContentCopyFile(item.depOriginFile, item.depDestFile);
+          });
+        }
+        if (depOriginFile.endsWith('.wxs')) {
+          const defs = dfsFindCommonDep(depOriginFile, depDestFile, ['.wxs'], isWatch);
+          // console.log('wxs defs', defs);
+          defs.forEach((item) => {
+            diffContentCopyFile(item.depOriginFile, item.depDestFile);
+          });
+        }
+      });
+
+      file.contents = new Buffer(contents);
+    }
+
+    this.push(file);
+    cb();
+  });
+
+  return stream;
+}
+
+module.exports = {
+  mpWxmlDep,
+  dfsFindWxmlDep,
+};

package/src/gulp/plugins/postcss-font-base64.js

@@ -0,0 +1,72 @@
+/* eslint-disable no-param-reassign */
+const postcss = require('postcss');
+const fs = require('fs');
+const path = require('path');
+const { fail } = require('../../utils/log');
+
+module.exports = postcss.plugin('postcss-font-base64', (options) => {
+  options = {
+    ...options,
+    ...{
+      match: { Scrabble: ['fakefont'] },
+      format: ['eot', 'woff', 'woff2', 'ttf'],
+    },
+  };
+
+  return function (css, result) {
+    css.walkAtRules('font-face', (fontFace) => {
+      const fileTypeRegex = getRegexStringForFileTypes(options.format);
+
+      fontFace.replaceValues(new RegExp(`url\\(["']?.+\\.${fileTypeRegex}["']?\\)`), (attr) => {
+        const fontRePath = attr.replace(/(url|'|"|\(|\)|\?#iefix)/g, '');
+        const fontAbPath = path.join(path.dirname(result.opts.from), fontRePath);
+        const res64 = base64Encode(fontAbPath);
+        const newUrlStr = 'url(data:'.concat(getMimeType(attr)).concat(';charset=utf-8;base64,')
+          .concat(res64)
+          .concat(')');
+        return res64 ? newUrlStr : attr;
+      });
+    });
+
+    function getRegexStringForFileTypes(fileTypes) {
+      const regex = fileTypes.map(fileType => (
+        fileType === 'eot'
+          ? fileType.concat('(\\?#iefix)?')
+          : fileType)).join('|');
+      return regex ? `(${regex})` : '';
+    }
+
+    // helper functions
+    function getMimeType(attribute) {
+      const formats = {
+        '.woff': 'application/font-woff',
+        '.woff2': 'font/woff2',
+        '.ttf': 'application/font-sfnt',
+        '.eot': 'application/vnd.ms-fontobject',
+        '.otf': 'application/font-sfnt',
+      };
+
+      let match = '';
+      const extension = attribute.match(/\.[a-z]{3,4}/)[0];
+
+      if (extension in formats) {
+        match = formats[extension];
+      };
+      return match;
+    };
+
+    function base64Encode(file) {
+      if (fs.existsSync(file)) {
+        return readAndEncodeFile(file);
+      }
+
+      fail(`${file} does not exist.`);
+      return '';
+    }
+
+    function readAndEncodeFile(file) {
+      const bitmap = fs.readFileSync(file);
+      return new Buffer(bitmap).toString('base64');
+    }
+  };
+});

package/src/gulp/plugins/utils/pluginError.js

@@ -0,0 +1,25 @@
+/* eslint-disable no-param-reassign */
+const { fail } = require('../../../utils/log');
+
+function pluginError(error, isWatch) {
+  const errorOptions = { showStack: true };
+
+  errorOptions.error = error;
+  errorOptions.fileName = error.file;
+  errorOptions.lineNumber = error.line;
+  errorOptions.showProperties = false;
+  errorOptions.showStack = false;
+
+  const errMsg = error.message;
+
+  if (isWatch) {
+    fail(errMsg);
+  } else {
+    fail(errMsg);
+    process.exit(1);
+  }
+}
+
+module.exports = {
+  pluginError,
+};

package/src/index.js

@@ -37,7 +37,6 @@ function registerCommand(program, commands) {
 
 registerCommand(program, commands);
 
-
 program.on('--help', () => {
   log();
   log(`  Run ${chalk.cyan(`${TMS_NAME}  <command> --help`)} for detailed usage of given command.`);

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

@@ -5,7 +5,7 @@ const gulpBuild = require('../../../gulp/build');
 
 async function build(tmsConfig, targetModules, env) {
   // 开始构建前，清理输出目录
-  await shelljs.rm('-rf', resolve(tmsConfig.gulp.outputDir));
+  await shelljs.rm('-rf', resolve(tmsConfig.outputDir));
 
   const { targetModules: newModules } = await init(tmsConfig, targetModules);
 

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

@@ -45,7 +45,7 @@ function isInit(tmsConfig, targetModules, contextDir) {
   }
 
   //  判断package.json的版本是否有新的版本
-  return checkDependencies(targetModules, resolve('./'), tmsConfig.gulp.outputDir);
+  return checkDependencies(targetModules, resolve('./'), tmsConfig.outputDir);
 }
 
 async function dev(tmsConfig, targetModules, env) {

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

@@ -17,17 +17,17 @@ const install = require('../install');
  * @returns
  */
 const cpFilesToOutput = function (tmsConfig, targetModules, defaultFiles) {
-  const outputDir = resolve(tmsConfig.gulp.outputDir);
+  const outputDir = resolve(tmsConfig.outputDir);
   io.ensureDirExist(outputDir);
   defaultFiles.forEach((item) => {
     if (fs.existsSync(resolve(item))) {
-      shelljs.cp('-rf', resolve(item), resolve(tmsConfig.gulp.outputDir, item));
+      shelljs.cp('-rf', resolve(item), resolve(tmsConfig.outputDir, item));
     }
   });
 
   // 拷贝模块的package.json到编译输出目录
   targetModules.forEach((item) => {
-    const outputModuleDir = resolve(`${tmsConfig.gulp.outputDir}/${item.root}`);
+    const outputModuleDir = resolve(`${tmsConfig.outputDir}/${item.root}`);
     if (!fs.existsSync(resolve(item.path))) {
       fail(`${item.path}模块代码路径不存在, 请检查tms.config.js的${item.name}模块的path`);
       process.exit(1);
@@ -69,7 +69,7 @@ async function task(tmsConfig, targetModules) {
 
   return newModules;
 }
-async function bootstrap(tmsConfig, targetModules) {
+async function init(tmsConfig, targetModules) {
   const newModules = await task(tmsConfig, targetModules);
 
   return {
@@ -77,4 +77,4 @@ async function bootstrap(tmsConfig, targetModules) {
   };
 }
 
-module.exports = bootstrap;
+module.exports = init;

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

@@ -11,7 +11,7 @@ async function install(tmsConfig, modules, isCloud = true) {
     mpNpmInstallAll,
     '小程序 开始npm install',
     '小程序npm install 完成',
-  )(newModules, resolve(tmsConfig.gulp.outputDir), `${CACHE_DIR}/node_modules`);
+  )(newModules, resolve(tmsConfig.outputDir), `${CACHE_DIR}/node_modules`);
 
   // 构建miniprograme_npm
   await createTask(

package/src/utils/buildAppJson.js

@@ -1,5 +1,5 @@
 const fs = require('fs');
-const { DEFAULT_MODULE_DIR, MODULE_CONFIG_FILENAME } = require('../config/constant');
+const { DEFAULT_MODULE_DIR, MODULE_CONFIG_FILENAME, MODULE_CONFIG_INVALID_KEY } = require('../config/constant');
 const { fail } = require('./log');
 const { resolve, isObject, isArray } = require('./widgets');
 
@@ -98,7 +98,7 @@ const getAppJsonContent = (sourceAppJsonPath) => {
   // 加入默认值
   appJson.subpackages = [];
   appJson.pages = [];
-  appJson.plugins = {};
+  // appJson.plugins = {};
   delete appJson.entranceDeclare;
   return appJson;
 };
@@ -116,6 +116,60 @@ const updateSubpackages = (appJson, modulesConfig) => {
   }
 };
 
+/**
+ * 处理合并subpackages后的appjson, 整理重复不合法的地方
+ * @param {Object} appJson appjson
+ */
+const processAppJson = (appJson) => {
+  const { subpackages } = appJson;
+  const pluginsMap = {};
+  Object.keys(appJson.plugins || {}).forEach(key => pluginsMap[key] = ['app.json']);
+  const subps = subpackages.map((subp) => {
+    const invalidKeys = [];
+    Object.keys(subp).forEach((key) => {
+      if (key === 'plugins') {
+        Object.keys(subp.plugins).forEach((pk) => {
+          pluginsMap[pk] ? pluginsMap[pk].push(`分包${subp.name}`) : pluginsMap[pk] = [`分包${subp.name}`];
+        });
+        return;
+      }
+      if (MODULE_CONFIG_INVALID_KEY.indexOf(key) > -1) {
+        // 如果分包配置中有不支持的key，则错误提醒
+        invalidKeys.push(key);
+        return;
+      }
+      if (['requiredBackgroundModes', 'embeddedAppIdList'].indexOf(key) > -1) {
+        // 提到appjson最上层处理
+        const preVal = appJson[key];
+        // eslint-disable-next-line
+        preVal ? appJson[key] = Array.from(new Set(preVal
+          // eslint-disable-next-line
+          .slice(0).concat(subp[key]))) : appJson[key] = subp[key].slice(0);
+        return;
+      }
+    });
+    if (invalidKeys.length) {
+      fail(`不支持分包${subp?.name}配置${invalidKeys.join(',')}\n`);
+    }
+    // eslint-disable-next-line
+    invalidKeys.concat(['requiredBackgroundModes', 'embeddedAppIdList']).forEach(k => delete subp[k]);
+    return subp;
+  });
+  // 如果plugins重复，则错误提示
+  const pluginsErrMsg = Object.keys(pluginsMap).map((pk) => {
+    if (pluginsMap[pk].length > 1) {
+      return `${pluginsMap[pk].join(',')}重复配置plugin(${pk});`;
+    }
+    return '';
+  })
+    .reduce((pre, cur) => pre + cur, '');
+  if (pluginsErrMsg) {
+    fail(pluginsErrMsg);
+  }
+  // eslint-disable-next-line
+  appJson.subpackages = subps;
+};
+
 
 /**
  * 动态生成编译后的app.json
@@ -130,10 +184,12 @@ function buildOutputAppJson(tmsConfig, modules) {
   const appJson = getAppJsonContent(resolve('./app.json'));
   // 更新app.json中的subpackages
   updateSubpackages(appJson, modulesConfig);
+  // 处理appJson中重复||冲突的地方
+  processAppJson(appJson);
   // 更新主包，需在subpackages处理完成后执行， pages/
   updateMainPackages(appJson, tmsConfig.mainPackages, DEFAULT_MODULE_DIR);
 
-  fs.writeFileSync(resolve(`${tmsConfig.gulp.outputDir}/app.json`), JSON.stringify(appJson, null, 2), 'utf8');
+  fs.writeFileSync(resolve(`${tmsConfig.outputDir}/app.json`), JSON.stringify(appJson, null, 2), 'utf8');
 
   return appJson;
 }

package/src/utils/cloneModules.js

@@ -64,6 +64,7 @@ async function downLoadAndMoveModule(sourceDir, targetDir,  moduleInfo) {
   const globalInstance = getGlobalInstance();
   const moduleInCache = globalInstance.getModuleCache(httpRepoUrl, cloneBranch);
 
+
   try {
     if (!moduleInCache) {
       await downloadRepoForGit(httpRepoUrl, sourcePath, cloneBranch);

package/src/utils/findCssImport.js

@@ -0,0 +1,30 @@
+/* eslint-disable no-param-reassign */
+const strip = require('strip-comments');
+// 匹配规则
+const MATCH_RULE = new RegExp(/@import *(?:url\(['"]?([^'")]+)['"]?\)|['"]([^'"]+)['"]);?/g);
+
+/**
+ * 获取样式文件中的@import语句
+ * @param code 代码片段
+ * @returns 结果数组
+ */
+const findCssImports = (code) => {
+  // 将buffer转成字符串
+  code = code.toString();
+  // 去除注释
+  code = strip.block(code);
+  // 定义最后返回的结果
+  const result = [];
+  let matchList;
+  // 循环遍历代码段，直至匹配结果为空
+  while ((matchList = MATCH_RULE.exec(code))) {
+    // 存入结果数组
+    result.push(matchList?.[1] || matchList?.[2]);
+  }
+  // 返回结果
+  return result;
+};
+
+module.exports = {
+  findCssImports,
+};

package/src/utils/io.js

@@ -6,6 +6,17 @@ const path = require('path');
  * @returns
  */
 const isDirEmpty = dirname => fs.promises.readdir(dirname).then(files => files.length === 0);
+
+// 判断是否是文件
+const isFile = (pathName) => {
+  try {
+    const stat = fs.lstatSync(pathName);
+    return stat.isFile();
+  } catch {
+    return false;
+  }
+};
+
 /**
  * 确保目录存在，不存在就创建一个
  * @param {*} dirname 目录名
@@ -26,13 +37,31 @@ const copyFile = function (src, dest) {
   fs.copyFileSync(src, dest);
 };
 
+// 判断文件内容是否一致，不一致再进行拷贝
+function diffContentCopyFile(originFile, destFile) {
+  if (fs.existsSync(destFile)) {
+    const depDestContent = fs.readFileSync(destFile, 'utf8');
+    const depOriginContent = fs.readFileSync(originFile, 'utf8');
+    if (depDestContent !== depOriginContent) {
+      console.log(`拷贝${originFile}内容到${destFile}`);
+      copyFile(originFile, destFile);
+    }
+  } else {
+    console.log(`拷贝${originFile}内容到${destFile}`);
+    copyFile(originFile, destFile);
+  }
+}
+
 // 添加后缀
 function ext(filePath, extensions) {
   let newFilePath = filePath;
+  let extPath = '';
+  // try catch需要包裹：用来处理'./lib/timer'没有后缀的情况
   try {
     const stat = fs.lstatSync(newFilePath);
     if (stat.isDirectory()) {
-      newFilePath += (newFilePath[newFilePath.length - 1] === '/') ? 'index' : '/index';
+      extPath = newFilePath[newFilePath.length - 1] === '/' ? 'index' : '/index';
+      newFilePath += extPath;
     }
   } catch (e) {}
 
@@ -40,16 +69,24 @@ function ext(filePath, extensions) {
     const file = newFilePath.endsWith(ext) ? newFilePath : newFilePath + ext;
     if (fs.existsSync(file)) {
       return {
-        file,
         ext,
+        extPath: extPath + ext,
+        file,
       };
     }
   }
-  return null;
+  return {
+    ext: '',
+    extPath,
+    file: filePath,
+  };
 }
 
 // 判断文件是否在某个目录
 const fileInDir = (dir, file) => {
+  if (!fs.existsSync(dir) || !fs.existsSync(file)) {
+    return false;
+  }
   const relativePath = path.relative(dir, file);
   if (relativePath.startsWith('..')) {
     return false;
@@ -57,10 +94,13 @@ const fileInDir = (dir, file) => {
   return true;
 };
 
+
 module.exports = {
   isDirEmpty,
   copyFile,
+  diffContentCopyFile,
   ensureDirExist,
   ext,
   fileInDir,
+  isFile,
 };

package/src/utils/widgets.js

@@ -7,7 +7,7 @@ const fs = require('fs');
 const shelljs = require('shelljs');
 const download = require('download-git-repo');
 const chalk = require('chalk');
-const shelljsOptons =  { slient: true };
+const shelljsOptions =  { slient: true };
 
 // 获取当前目录
 const cwd = process.cwd();
@@ -96,7 +96,7 @@ function downloadRepo(dest, downloadOptions = { repoUrl: '', gitUrl: '', branch:
 function downloadRepoForGit(url, dest, branch) {
   const cwd = process.cwd();
 
-  return new Promise((resolve) => {
+  return new Promise((resolve, reject) => {
     // 如果目标目录不存在
     if (fs.existsSync(dest)) {
       shelljs.rm('-rf', path.join(dest));
@@ -105,7 +105,10 @@ function downloadRepoForGit(url, dest, branch) {
     shelljs.mkdir('-p', dest);
     shelljs.cd(dest);
 
-    shelljs.exec(`git clone ${url} ${dest} --branch ${branch} --depth 1`, shelljsOptons);
+    const gitCloneRes = shelljs.exec(`git clone ${url} ${dest} --branch ${branch} --depth 1`, shelljsOptions);
+    if (gitCloneRes.code !== 0) {
+      reject(gitCloneRes.stderr);
+    }
 
     shelljs.cd(cwd);
     resolve();