@tmsfe/tmskit 0.0.5-beta.0 → 0.0.5-beta.4

package/package.json

@@ -1,11 +1,12 @@
 {
   "name": "@tmsfe/tmskit",
-  "version": "0.0.5-beta.0",
+  "version": "0.0.5-beta.4",
   "description": "tmskit",
   "main": "main.js",
   "bin": {
     "tmskit": "main.js"
   },
+  "files": ["src", "dist", "main.js", "package.json"],
   "scripts": {
     "dev": "rollup -wc --environment TARGET:tmskit",
     "build": "rollup -c --environment TARGET:tmskit"
@@ -37,23 +38,30 @@
     "ejs": "^3.1.5",
     "glob-ignore": "^1.0.2",
     "gulp": "^4.0.2",
-    "gulp-less": "^5.0.0",
+    "gulp-cache": "^1.1.3",
+    "gulp-image": "^5.1.0",
+    "gulp-postcss": "^9.0.1",
     "gulp-px-to-rpx": "^1.0.7",
-    "gulp-rename": "^2.0.0",
     "gulp-watch": "^5.0.1",
+    "htmlparser2": "^7.2.0",
     "inquirer": "^7.3.3",
     "leven": "3.1.0",
     "lodash": "^4.17.21",
     "metalsmith": "^2.3.0",
     "miniprogram-ci": "1.4.13",
+    "object-assign": "^4.0.1",
     "ora": "^5.1.0",
+    "plugin-error": "^1.0.0",
+    "postcss": "^8.4.6",
     "precinct": "^8.3.1",
     "replace-ext": "^2.0.0",
     "shelljs": "^0.8.4",
-    "through2": "^4.0.2"
+    "strip-comments": "^2.0.1",
+    "through2": "^4.0.2",
+    "vinyl-sourcemaps-apply": "^0.2.0"
   },
   "engines": {
-    "node": "^12.17.0 || >= 14.0.0"
+    "node": "^12.17.0 || >= 14.13.1"
   },
   "jest": {
     "testEnvironment": "jest-environment-node"

package/src/config/constant.js

@@ -49,6 +49,7 @@ const ENV = {
 };
 
 const  TEMPLATE_TKIT_DIR = '_tmskit';
+const MODULE_CONFIG_INVALID_KEY = ['entranceDeclare', 'entryPagePath'];
 
 export {
   HOME_DIR,
@@ -65,4 +66,5 @@ export {
   MODE,
   ENV,
   TEMPLATE_TKIT_DIR,
+  MODULE_CONFIG_INVALID_KEY,
 };

package/src/config/defaultTmsConfig.js

@@ -6,11 +6,13 @@ module.exports = {
   modules: [],
   cloudDir: 'cloud',
   gulp: {
+    // 第三方依赖代码需要拷贝到本项目的
+    dependencies: {},
     /** 编译输出文件夹位置 */
     outputDir: 'dist',
     /** 源码监听路径 */
     sourceDir: './',
-    /** 源码Map */
-    copyDir: [],
+    /** 静态资源目录 */
+    static: [],
   },
 };

package/src/gulp/build.js

@@ -1,78 +1,8 @@
-const fs = require('fs');
-const { src, dest }  = require('gulp');
-const px2rpx = require('gulp-px-to-rpx');
-const less = require('gulp-less');
-const rename = require('gulp-rename');
-const { resolve } = require('../utils/widgets');
-const { buildOutputAppJson } = require('../utils/buildAppJson');
-const { DEFAULT_COPY_CONFIG } = require('../config/constant');
-const replaceEnv = require('./replaceEnv');
+const shelljs = require('shelljs');
+const dev = require('./dev');
 
 module.exports = async (tmsConfig, newModules) => {
-  // app.json
-  buildOutputAppJson(tmsConfig, newModules);
+  shelljs.rm('-rf', tmsConfig.gulp.outputDir);
 
-  // 监听根目录的文件
-  DEFAULT_COPY_CONFIG.forEach((item) => {
-    if (fs.existsSync(resolve(item))) {
-      src(resolve(item))
-        .pipe(dest(resolve(tmsConfig.gulp.outputDir)));
-    }
-  });
-  src([resolve('app.less'), resolve('app.wxss')], { allowEmpty: true })
-    .pipe(less())
-    .pipe(px2rpx({
-      designWidth: 375, // 设计稿宽度，默认为750
-      precision: 2, // 小数最大精度，默认为6
-    }))
-    .pipe(rename({ extname: '.wxss' }))
-    .pipe(dest(resolve(tmsConfig.gulp.outputDir)));
-
-  src([resolve('app.js'), resolve('app.ts')], { allowEmpty: true })
-    .pipe(replaceEnv(/process\.env(\.(\w*))?/g, tmsConfig.envData))
-    .pipe(dest(resolve(tmsConfig.gulp.outputDir)));
-
-  // 监听模块的文件
-  for (const module of newModules) {
-    // 监听模块js文件
-    src([
-      `${resolve(module.path)}/**/*.js`,
-      `${resolve(module.path)}/**/*.ts`,
-      `${resolve(module.path)}/**/*.wxs`,
-    ])
-      .pipe(replaceEnv(/process\.env(\.(\w*))?/g, tmsConfig.envData))
-      .pipe(dest(resolve(tmsConfig.gulp.outputDir, module.root)));
-
-    // 监听json文件
-    src([
-      `${resolve(module.path)}/**/*.json`,
-    ])
-      .pipe(dest(resolve(tmsConfig.gulp.outputDir, module.root)));
-
-    // 监听css文件
-    src([
-      `${resolve(module.path)}/**/*.less`,
-      `${resolve(module.path)}/**/*.wxss`,
-    ])
-      .pipe(less())
-      .pipe(px2rpx({
-        designWidth: 375, // 设计稿宽度，默认为750
-        precision: 2, // 小数最大精度，默认为6
-      }))
-      .pipe(rename({ extname: '.wxss' }))
-      .pipe(dest(resolve(tmsConfig.gulp.outputDir, module.root)));
-
-    // 监听wxml文件
-    src([
-      `${resolve(module.path)}/**/*.wxml`,
-    ])
-      .pipe(dest(resolve(tmsConfig.gulp.outputDir, module.root)));
-  }
-  // 监听copy模块
-  if (tmsConfig?.gulp?.copyDir.length > 0) {
-    for (const item of tmsConfig.gulp?.copyDir) {
-      src([item.from])
-        .pipe(dest(item.to));
-    }
-  }
+  dev(tmsConfig, newModules, false);
 };

package/src/gulp/compile.js

@@ -0,0 +1,87 @@
+const { src, dest, lastRun } = require('gulp');
+const px2rpx = require('gulp-px-to-rpx');
+const postcss = require('gulp-postcss');
+const watch = require('gulp-watch');
+const cache = require('gulp-cache');
+const image = require('gulp-image');
+const replaceEnv = require('./replaceEnv');
+const { mpCommonDep } = require('./plugins/mpCommonDep');
+const { mpJsonDep } = require('./plugins/mpJsonDep');
+const { mpWxmlDep } = require('./plugins/mpWxmlDep');
+const base64 = require('./plugins/postcss-font-base64');
+const { fail } = require('../utils/log');
+
+const since = task => file => (lastRun(task) > file.stat.ctime ? lastRun(task) : 0);
+module.exports = function (
+  tmsConfig,
+  {
+    glob,
+    destPath,
+    srcOption,
+    module,
+    watchOption = { events: ['change', 'add', 'unlink'] },
+    isWatch,
+  },
+) {
+  Object.keys(glob).forEach((globKey) => {
+    const globValue = glob[globKey];
+    const task = () => src(globValue, { ...srcOption, since: since(task) });
+    let srcPipe = task();
+
+    if (isWatch) {
+      srcPipe = srcPipe.pipe(watch(globValue, watchOption));
+    }
+
+    switch (globKey) {
+      case 'js':
+        srcPipe
+          .pipe(replaceEnv(/process\.env(\.(\w*))?/g, tmsConfig.envData))
+          .pipe(mpCommonDep(tmsConfig, module, ['.js', '.ts', '.wxs', '.json'], isWatch))
+          .pipe(dest(destPath))
+          .on('error', (err) => {
+            fail(`js编译报错${err}`);
+          });
+        break;
+      case 'wxss':
+        srcPipe
+          .pipe(mpCommonDep(tmsConfig, module, ['.wxss', '.less'], isWatch))
+          .pipe(postcss([base64()]))
+          .on('error', (err) => {
+            fail(`postcss编译报错${err}`);
+          })
+          .pipe(px2rpx({
+            designWidth: 375, // 设计稿宽度，默认为750
+            precision: 2, // 小数最大精度，默认为6
+          }))
+          .pipe(dest(destPath));
+        break;
+      case 'json':
+        srcPipe
+          .pipe(mpJsonDep(tmsConfig, module, ['.json'], ['.wxml', '.json', '.js', '.ts', '.wxss', '.less'], isWatch))
+          .on('error', (err) => {
+            fail(`json编译报错${err}`);
+          })
+          .pipe(dest(destPath));
+        break;
+      case 'wxml':
+        srcPipe
+          .pipe(mpWxmlDep(tmsConfig, module, isWatch))
+          .pipe(dest(destPath));
+        break;
+      case 'image':
+        srcPipe
+          .pipe(cache(image()))
+          .on('error', (err) => {
+            fail(`image编译报错${err}`);
+          })
+          .pipe(dest(destPath));
+        break;
+      case 'other':
+        srcPipe
+          .pipe(dest(destPath));
+        break;
+      default:
+        break;
+    }
+  });
+};

package/src/gulp/dev.js

@@ -1,94 +1,108 @@
-const fs = require('fs');
-const { src, dest }  = require('gulp');
-const px2rpx = require('gulp-px-to-rpx');
-const less = require('gulp-less');
-const rename = require('gulp-rename');
 const watch = require('gulp-watch');
 const { resolve } = require('../utils/widgets');
 const { buildOutputAppJson } = require('../utils/buildAppJson');
 const { DEFAULT_COPY_CONFIG } = require('../config/constant');
-const replaceEnv = require('./replaceEnv');
+const compile = require('./compile');
 
-module.exports = async (tmsConfig, newModules) => {
+function excludeGlob(glob) {
+  const otherArr = new Set();
+  otherArr.add('!**/*.{ttf,otf,woff,eot}');
+  Object.keys(glob).forEach((globKey) => {
+    if (typeof glob[globKey] === 'string') {
+      const data = glob[globKey].startsWith('!') ? glob[globKey] : `!${glob[globKey]}`;
+      otherArr.add(data);
+    } if (Array.isArray(glob[globKey])) {
+      glob[globKey].forEach((value) => {
+        if (typeof value === 'string') {
+          const data = value.startsWith('!') ? value : `!${value}`;
+          otherArr.add(data);
+        }
+      });
+    }
+  });
+  return Array.from(otherArr);
+}
+
+module.exports = async (tmsConfig, newModules, isWatch = true) => {
   // 监听app.json
-  watch(resolve('app.json'), { ignoreInitial: false, events: ['add', 'change'] }, () => {
+  if (isWatch) {
+    watch(resolve('app.json'), { ignoreInitial: false, events: ['add', 'change'] }, () => {
+      buildOutputAppJson(tmsConfig, newModules);
+    });
+  } else {
     buildOutputAppJson(tmsConfig, newModules);
-  });
+  }
 
   // 监听根目录的文件
-  DEFAULT_COPY_CONFIG.forEach((item) => {
-    if (fs.existsSync(resolve(item))) {
-      src(resolve(item))
-        .pipe(watch(resolve(item), { events: ['change'] }))
-        .pipe(dest(resolve(tmsConfig.gulp.outputDir)));
-    }
+  compile(tmsConfig, {
+    glob: {
+      json: DEFAULT_COPY_CONFIG.map(item => resolve(item)),
+      wxss: ['app.less', 'app.wxss'].map(item => resolve(item)),
+      js: ['app.js', 'app.ts'].map(item => resolve(item)),
+    },
+    module: { from: '', to: '' },
+    destPath: resolve(tmsConfig.gulp.outputDir),
+    srcOption: { allowEmpty: true },
+    isWatch,
   });
-  src([resolve('app.less'), resolve('app.wxss')], { allowEmpty: true })
-    .pipe(watch(`${resolve()}/(app.less|app.wxss)`, { events: ['change'] }))
-    .pipe(less())
-    .pipe(px2rpx({
-      designWidth: 375, // 设计稿宽度，默认为750
-      precision: 2, // 小数最大精度，默认为6
-    }))
-    .pipe(rename({ extname: '.wxss' }))
-    .pipe(dest(resolve(tmsConfig.gulp.outputDir)));
-
-  src([resolve('app.js'), resolve('app.ts')], { allowEmpty: true })
-    .pipe(watch(`${resolve()}/(app.js|app.ts)`, { events: ['change'] }))
-    .pipe(replaceEnv(/process\.env(\.(\w*))?/g, tmsConfig.envData))
-    .pipe(dest(resolve(tmsConfig.gulp.outputDir)));
 
   // 监听模块的文件
-  for (const module of newModules) {
-    // 监听模块js文件
-    src([
-      `${resolve(module.path)}/**/*.js`,
-      `${resolve(module.path)}/**/*.ts`,
-      `${resolve(module.path)}/**/*.wxs`,
-    ])
-      .pipe(watch(`${resolve(module.path)}/**/(*.js|*.ts|*.wxs)`, {  events: ['add', 'change'] }))
-      .pipe(replaceEnv(/process\.env(\.(\w*))?/g, tmsConfig.envData))
-      .pipe(dest(resolve(tmsConfig.gulp.outputDir, module.root)));
+  for (let module of newModules) {
+    // 处理默认参数
+    module = {
+      ...{ exclude: [] },
+      ...module,
+    };
 
-    // 监听json文件
-    src([
-      `${resolve(module.path)}/**/*.json`,
-    ])
-      .pipe(watch(`${resolve(module.path)}/**/*.json`, {  events: ['add', 'change'] }))
-      .pipe(dest(resolve(tmsConfig.gulp.outputDir, module.root)));
-
-    // 监听css文件
-    src([
-      `${resolve(module.path)}/**/*.less`,
-      `${resolve(module.path)}/**/*.wxss`,
-    ])
-      .pipe(watch(`${resolve(module.path)}/**/(*.less|*.wxss)`, {  events: ['add', 'change'] }))
-      .pipe(less())
-      .pipe(px2rpx({
-        designWidth: 375, // 设计稿宽度，默认为750
-        precision: 2, // 小数最大精度，默认为6
-      }))
-      .pipe(rename({ extname: '.wxss' }))
-      .pipe(dest(resolve(tmsConfig.gulp.outputDir, module.root)));
+    if (isWatch) {
+      // 监听模块配置文件
+      watch(`${resolve(module.path)}/**/module.config.json`, {  events: ['change'] }, () => {
+        buildOutputAppJson(tmsConfig, newModules);
+      });
+    }
 
-    // 监听wxml文件
-    src([
-      `${resolve(module.path)}/**/*.wxml`,
-    ])
-      .pipe(watch(`${resolve(module.path)}/**/*.wxml`, {  events: ['add', 'change'] }))
-      .pipe(dest(resolve(tmsConfig.gulp.outputDir, module.root)));
+    const excludes = module.exclude.map(key => `!${resolve(key)}`);
+    const glob = {
+      js: [`${resolve(module.path)}/**/*.{js,ts,wxs}`, ...excludes],
+      json: [`${resolve(module.path)}/**/*.json`, ...excludes],
+      wxss: [`${resolve(module.path)}/**/*.{less,wxss}`, ...excludes],
+      wxml: [`${resolve(module.path)}/**/*.wxml`, ...excludes],
+      image: [`${resolve(module.path)}/**/*.{png,jpg,jpeg,gif,svg}`, ...excludes],
+    };
 
-    // 监听模块配置文件
-    watch(`${resolve(module.path)}/**/module.config.json`, {  events: ['change'] }, () => {
-      buildOutputAppJson(tmsConfig, newModules);
+    compile(tmsConfig, {
+      glob: {
+        ...glob,
+        other: [`${resolve(module.path)}/**/*`, ...excludeGlob(glob)],
+      },
+      destPath: resolve(tmsConfig.gulp.outputDir, module.root),
+      module: { from: module.path, to: module.root },
+      srcOption: { allowEmpty: true },
+      isWatch,
     });
   }
+
   // 监听copy模块
-  if (tmsConfig?.gulp?.copyDir.length > 0) {
-    for (const item of tmsConfig.gulp?.copyDir) {
-      src([item.from])
-        .pipe(watch(item.from, {  events: ['add', 'change'] }))
-        .pipe(dest(item.to));
+  if (tmsConfig?.gulp?.static && tmsConfig?.gulp?.static.length > 0) {
+    for (const item of tmsConfig.gulp?.static) {
+      const glob = {
+        js: `${item.from}/**/*.{js,ts,wxs}`,
+        json: `${item.from}/**/*.json`,
+        wxss: `${item.from}/**/*.{less,wxss}`,
+        wxml: `${item.from}/**/*.wxml`,
+        image: `${item.from}/**/*.{png,jpg,jpeg,gif,svg}`,
+      };
+
+      compile(tmsConfig, {
+        glob: {
+          ...glob,
+          other: [`${item.from}/**/*`, ...excludeGlob(glob)],
+        },
+        destPath: item.to,
+        module: item,
+        srcOption: { allowEmpty: true },
+        isWatch,
+      });
     }
   }
 };

package/src/gulp/plugins/less.js

@@ -0,0 +1,116 @@
+/* eslint-disable no-param-reassign */
+const fs             = require('fs');
+const path           = require('path');
+const less           = require('less');
+const through2       = require('through2');
+const replaceExt     = require('replace-ext');
+const assign         = require('object-assign');
+const applySourceMap = require('vinyl-sourcemaps-apply');
+const PluginError    = require('plugin-error');
+const { fail } = require('../../utils/log');
+
+function inlineSources(map) {
+  if (map.sourcesContent) {
+    return Promise.resolve(map);
+  }
+
+  return Promise.all(map.sources.map(source => new Promise((resolve, reject) => {
+    fs.readFile(source, 'utf8', (err, data) => {
+      if (err) {
+        reject(err);
+      } else {
+        resolve(data);
+      }
+    });
+  }))).then(
+    (contents) => {
+      map.sourcesContent = contents;
+      return map;
+    },
+    () => map,
+  );
+}
+
+function renderLess(str, opts) {
+  return new Promise((resolve, reject) => {
+    less.render(str, opts, (err, res) => {
+      if (err) {
+        reject(err);
+      } else {
+        const obj = {
+          result: res.css,
+          imports: res.imports,
+        };
+        if (opts.sourceMap && res.map) {
+          obj.sourcemap = JSON.parse(res.map);
+          inlineSources(obj.sourcemap).then((map) => {
+            obj.sourcemap = map;
+            resolve(obj);
+          });
+        } else {
+          resolve(obj);
+        }
+      }
+    });
+  });
+}
+
+module.exports = function (options) {
+  const opts = assign({}, {
+    compress: false,
+    paths: [],
+    isWatch: false,
+  }, options);
+
+  return through2.obj((file, enc, cb) => {
+    if (file.isNull()) {
+      return cb(null, file);
+    }
+
+    if (file.isStream()) {
+      return cb(new PluginError('gulp-less', 'Streaming not supported'));
+    }
+
+    const str = file.contents.toString();
+
+    // Injects the path of the current file
+    opts.filename = file.path;
+
+    // Bootstrap source maps
+    if (file.sourceMap || opts.sourcemap) {
+      opts.sourceMap = true;
+    }
+
+    renderLess(str, opts).then((res) => {
+      file.contents = Buffer.from(res.result);
+      file.path = replaceExt(file.path, '.wxss');
+      if (res.sourcemap) {
+        res.sourcemap.file = file.relative;
+        res.sourcemap.sources = res.sourcemap.sources.map(source => path.relative(file.base, source));
+
+        applySourceMap(file, res.sourcemap);
+      }
+      return file;
+    })
+      .then((file) => {
+        console.log(`less编译完成${file.path}`);
+        cb(null, file);
+      })
+      .catch((err) => {
+        // Convert the keys so PluginError can read them
+        err.lineNumber = err.line;
+        err.fileName = err.filename;
+
+        // Add a better error message
+        const message = `${err.message} in file ${err.fileName} line no. ${err.lineNumber}`;
+        err.message = message;
+        if (opts.isWatch) {
+          // watch的时候，报错提示，不退出进程
+          fail(err);
+          return cb(null, file);
+        }
+        // 不watch的时候，报错退出进程
+        return cb(new PluginError('gulp-less', err));
+      });
+  });
+};

package/src/gulp/plugins/mpCommonDep.js

@@ -0,0 +1,131 @@
+/* eslint-disable no-param-reassign */
+const through = require('through2');
+const precinct = require('precinct');
+const path = require('path');
+const { findCssImports }  = require('../../utils/findCssImport');
+const { ext, fileInDir, diffContentCopyFile } = require('../../utils/io');
+const { resolve } = require('../../utils/widgets');
+const fs = require('fs');
+const { pluginError } = require('./utils/pluginError');
+
+const cssFilter = ['.less', '.wxss'];
+const dfsFindCommonDep = function (anaFileOriginFile, anaFileDestFile, extensions, isWatch = true) {
+  const resDep = new Map();
+  function dfs(anaFileOriginFile, anaFileDestFile, extensions) {
+    let contents = '';
+    try {
+      contents = fs.readFileSync(anaFileOriginFile, 'utf8');
+    } catch (e) {
+      pluginError(e, isWatch);
+    }
+    const deps = cssFilter.indexOf(path.extname(anaFileOriginFile)) > -1
+      ? findCssImports(contents)
+      : precinct(contents);
+    deps.forEach((depItem) => {
+      if (depItem.startsWith('.')) {
+        // 被依赖文件的存在的绝对路径
+        const depOriginPath = path.join(path.dirname(anaFileOriginFile), depItem);
+        // 被依赖文件加上后缀
+        const { ext: extAlias, file: depOriginFile, extPath } = ext(depOriginPath, extensions);
+
+        if (!fs.existsSync(depOriginFile)) {
+          pluginError(
+            new Error(`${anaFileOriginFile}引用路径${depOriginFile}文件不存在, 请检查应用路径`),
+            isWatch,
+          );
+          return;
+        }
+
+        const depDestPath = resolve(path.dirname(anaFileDestFile), depItem);
+        const depDestFile = depDestPath.endsWith(extAlias) ? depDestPath : depDestPath + extPath;
+        if (!resDep.has(depDestFile)) {
+          resDep.set(depDestFile, {
+            anaFileOriginFile,
+            anaFileDestFile,
+            depDestFile,
+            depOriginFile,
+          });
+          dfs(depOriginFile, depDestFile, extensions);
+        }
+      }
+    });
+  }
+  dfs(anaFileOriginFile, anaFileDestFile, extensions);
+
+  return resDep;
+};
+
+function mpCommonDep(tmsConfig, module, extensions = [], isWatch = true) {
+  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.gulp.outputDir, module.to, anaFileRelativeModule);
+
+    if (file.isBuffer()) {
+      let contents = String(file.contents);
+      const deps = cssFilter.indexOf(path.extname(file.path)) > -1 ? findCssImports(contents) : precinct(contents);
+
+      const copyModules = new Map();
+      Object.keys(tmsConfig.gulp.dependencies).forEach((includeName) => {
+        const includePath = tmsConfig.gulp.dependencies[includeName];
+        deps.forEach((depItem) => {
+          if (depItem.indexOf(includeName) > -1) {
+            // 被依赖文件的存在的绝对路径 (eg: /User/thirdparty/loadsh)
+            const depOriginPath = path.join(path.dirname(anaFileOriginFile), depItem);
+            // 被依赖文件加上后缀
+            const { ext: extAlias, file: depOriginFile, extPath } = ext(depOriginPath, extensions);
+
+            if (!fileInDir(includePath, depOriginFile)) {
+              pluginError(
+                new Error(`${anaFileOriginFile}引用路径${depOriginFile}不在${includePath}不在文件夹内, 请检查应用路径`),
+                isWatch,
+              );
+              return;
+            }
+
+            // eslint-disable-next-line
+            const reg = new RegExp(`^(\.\.\/)+.*\/${includeName}\/(.*)`);
+            const regRes = depItem.match(reg) || [];
+            if (regRes[2]) {
+              const depDestPath = resolve(tmsConfig.gulp.outputDir, module.to, includeName, regRes[2]);
+              const depDestFile = depDestPath.endsWith(extAlias) ? depDestPath : depDestPath + extPath;
+              if (!copyModules.has(depDestFile)) {
+                copyModules.set(depDestFile, {
+                  depOriginFile,
+                  depDestFile,
+                  beforeDepPath: depItem,
+                  afterDepPath: path.relative(path.dirname(anaFileDestFile), depDestPath),
+                });
+              }
+            }
+          }
+        });
+      });
+
+      // console.log('mpCommonDep copyModules', copyModules);
+      copyModules.forEach(({ depOriginFile, depDestFile, beforeDepPath, afterDepPath }) => {
+        diffContentCopyFile(depOriginFile, depDestFile);
+        const reg = new RegExp(`['"]${beforeDepPath}["']`, 'g');
+        contents = contents.replace(reg, `"${afterDepPath}"`);
+
+        const defs = dfsFindCommonDep(depOriginFile, depDestFile, extensions, isWatch);
+        defs.forEach((item) => {
+          diffContentCopyFile(item.depOriginFile, item.depDestFile);
+        });
+        // console.log('mpCommonDep defs', defs);
+      });
+
+      file.contents = new Buffer(contents);
+    }
+    this.push(file);
+    cb();
+  });
+
+  return stream;
+}
+
+module.exports = {
+  mpCommonDep,
+  dfsFindCommonDep,
+};