feat: v1.1.3

.eslintrc.js

@@ -0,0 +1,3 @@
+module.exports = {
+  "extends": ["@efox/eslint-config-react-prittier-ts"]
+}

.gitignore

@@ -0,0 +1,4 @@
+node_modules
+yarn-error.log
+dist
+.emp-cache

.vscode/settings.json

@@ -0,0 +1,7 @@
+{
+  "editor.codeActionsOnSave": {
+    "source.fixAll.eslint": true
+  },
+  "typescript.tsdk": "node_modules/typescript/lib",
+  "typescript.enablePromptUseWorkspaceTsdk": true
+}

.yarnrc

@@ -0,0 +1,12 @@
+registry "https://registry.npm.taobao.org"
+disturl "https://npm.taobao.org/dist"
+sass_binary_site "https://npm.taobao.org/mirrors/node-sass/"
+phantomjs_cdnurl "http://cnpmjs.org/downloads"
+electron_mirror "https://npm.taobao.org/mirrors/electron/"
+sqlite3_binary_host_mirror "https://foxgis.oss-cn-shanghai.aliyuncs.com/"
+profiler_binary_host_mirror "https://npm.taobao.org/mirrors/node-inspector/"
+chromedriver_cdnurl "https://cdn.npm.taobao.org/dist/chromedriver"
+operadriver_cdnurl "https://npm.taobao.org/mirrors/operadriver"
+selenium_cdnurl "https://npm.taobao.org/mirrors/selenium"
+node_inspector_cdnurl "https://npm.taobao.org/mirrors/node-inspector"
+fsevents_binary_host_mirror "http://npm.taobao.org/mirrors/fsevents/"

commitlint.config.js

@@ -0,0 +1,23 @@
+module.exports = {
+  extends: ['@commitlint/config-conventional'],
+  rules: {
+    // type 类型定义
+    'type-enum': [
+      2,
+      'always',
+      [
+        'feat', // 新功能 feature
+        'fix', // 修复 bug
+        'refactor', // 重构(既不增加新功能，也不是修复bug)
+        'doc', // 文档注释
+        'test', // 增加测试
+        'chore', // 构建过程或辅助工具的变动
+        'style', // 代码格式(不影响代码运行的变动)
+        'revert', // 回退
+      ],
+    ],
+    // subject 大小写不做校验
+    // 自动部署的BUILD ROBOT的commit信息大写，以作区别
+    'subject-case': [0],
+  },
+}

lerna.json

@@ -0,0 +1,5 @@
+{
+  "useWorkspaces": true,
+  "npmClient": "yarn",
+  "version": "0.0.0"
+}

package.json

@@ -0,0 +1,34 @@
+{
+  "name": "emp-workspace",
+  "version": "1.0.0",
+  "main": "index.js",
+  "repository": "https://git.yy.com/webs/efox/lab/emp-workspace.git",
+  "author": "xuhongbin <xuhongbin@yy.com>",
+  "license": "MIT",
+  "private": true,
+  "scripts": {
+    "lint": "eslint . --ext js,ts,tsx --fix"
+  },
+  "workspaces": [
+    "packages/*",
+    "projects/*",
+    "helpers/*",
+    "components/*"
+  ],
+  "husky": {
+    "hooks": {
+      "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
+    }
+  },
+  "devDependencies": {
+    "@commitlint/config-conventional": "^8.3.4",
+    "@efox/eslint-config-react-prittier-ts": "^1.0.19",
+    "commitlint": "^8.3.5",
+    "cross-env": "^7.0.2",
+    "husky": "^4.2.5",
+    "lerna": "^3.22.0",
+    "lint-staged": "^10.2.7",
+    "typescript": "^3.9.3"
+  },
+  "dependencies": {}
+}

packages/emp-cli/. npmignore

@@ -0,0 +1,2 @@
+node_modules
+yarn-error.log

packages/emp-cli/CHANGELOG.md

@@ -0,0 +1,89 @@
+# @Efox EMP CLI Change Log
+> change log infomation
+## v1.1.12
++ 加入文件缓存 增加打包速度 
++ 升级 postcss
+
+## v1.1.11
++ 修复多host 支持问题
++ 优化打包速度 
++ 美化项目提示 
+
+## v1.1.10
++ emp-config.js 入参增加 webpack 方便二次配置 `remoteConfig({config, env, empEnv, webpack})`
+
+## v1.1.9
++ 利用 svgr 加载特性取代 babel 构建 增加构建速度
++ 兼容 cra require 方式
+
+## v1.1.8
++ 支持 SVGR & SVG
+
+## v1.1.4
++ 修复webpack 5.1.x 重构 webpack-dev-server 导致更新失败的问题 [相关内容](https://webpack.js.org/guides/hot-module-replacement/#via-the-nodejs-api)
+
+ ## v1.1.0
+> webpack5 beta31
+
+## v1.0.34 
++ 修复 svga 文件过小导致错误问题
+
+## v1.0.32
+> 增加 ./postcss.config.js 支持 
+```javascript
+module.exports = {
+  plugins: {
+    'postcss-px-to-viewport': {
+      viewportWidth: 720,
+      unitPrecision: 3,
+      viewportUnit: 'vw',
+      selectorBlackList: ['.ignore', '.hairlines'],
+      minPixelValue: 1,
+      mediaQuery: false,
+    },
+  },
+}
+```
+
+## v1.0.29  
+> 增加对 .browserslistrc 支持 
++ 根目录增加 .browserslistrc 
+```javascript
+last 1 version
+> 1%
+IE 9
+```
+
++ 安装polyfill `yarn add react-app-polyfill` 
++ 入口 `src/index.ts` 增加 
+```javascript
+import 'react-app-polyfill/ie9'
+import 'react-app-polyfill/stable'
+```
+
+## v1.0.19
++ 升级 webpack 5 beta 23
++ 优化图片调用方式
++ 加入 定级 await 支持
++ 加入 mjs 支持
++ 加入 wasm 支持
++ 加入 vue 支持 `:TODO 等待认领`
++ 引入 asset 替代 file-loader、url-loader、raw-loader
++ 升级 到 `@efox/emp-cli`:`^1.0.18` 可以使用新特征 配合 `@efox/emp-tsconfig`:`^1.0.1` 可以支持 top level await 特性
++ 微小改动:
+```javascript 
+ // `src/configs/index.ts`
+const env = process.env.EMP_ENV || 'dev'
+console.log('env project antd ===>', env)
+const config = require(`./${process.env.EMP_ENV || 'dev'}`) // 不懂直接加变量 需要加上 process.env.EMP_ENV，环境变量只在构建的时候寻找动态路径
+config.env = env
+export {env}
+export default config
+
+ ```
+ + 图片支持非 default 引用 
+ ```javascript 
+ <img src={require('src/assets/mf.png').default} width="300" />
+ //=>
+ <img src={require('src/assets/mf.png')} width="300" />
+ ``````

packages/emp-cli/README.md

@@ -0,0 +1,50 @@
+# EMP 工具库
+> 基于webpack5 module federation 微前端解决方案 
+
+## 快速开始
+`npx @efox/emp-cli init my-emp`
+
+## 安装 
+`npm i -g @efox/emp-cli` or `yarn global add @efox/emp-cli` 
+
+## 功能迭代 
+[更新文档](CHANGELOG.md)
+
+## 指令 
+
++ `emp init 项目名` 新建项目
++ `emp dev` 调试
+  + `emp dev --hot` 热更
+  + `emp dev --open` 打开调试页面
++ `emp build` 构建
+  + `emp build --env` 指定 部署环境
+  + `emp build --analyze` 分析
+  + `emp build --ts` 构建生产环境同时生成`index.d.ts`文件到`dist`目录
+    + `emp build --ts -p [types path] -n [types name]` `types path` 相对路径 默认 `dist`、`types name` 类型文件名 默认 `index.d.ts`
++ `emp tsc` 生成 `index.d.ts` 文件到`dist`目录  
+  + `emp build --ts -p [types path] -n [types name]` `types path` 相对路径 默认 `dist`、`types name` 类型文件名 默认 `index.d.ts`
+
++ `emp tss <remote-url>` 同步远程类型
+    + `emp tss <remote-url> -p [types path] -n [types name]` `types path` 相对路径 默认 `src`、`types name` 类型文件名 默认 `empType.d.ts`
++ `emp serve` 正式服务
++ `emp` help 
+
+
+## 环境变量 
++ MODE_ENV webpack mode 环境变量 , 通过 `process.env.EMP_ENV` 调用
++ EMP_ENV 通过 `emp dev --env prod` 进行设置 用来区分部署环境 , 通过 `process.env.EMP_ENV` 调用
+
+## 拓展
++ Typescript [定制类型文件](https://www.npmjs.com/package/@efox/emp-tune-dts-plugin)
+
+## VSCODE SETTINGS
+```json
+{
+  "editor.codeActionsOnSave": {
+    "source.fixAll.eslint": true //支持 eslint 自动格式化
+  },
+  "typescript.tsdk": "node_modules/typescript/lib", //支持 ts css module type check
+  "typescript.enablePromptUseWorkspaceTsdk": true   //支持 ts css module type check
+}
+
+```

packages/emp-cli/bin/emp.js

@@ -0,0 +1,151 @@
+#!/usr/bin/env node
+
+const program = require('commander') // 命令行工具
+const ora = require('ora') // 实现node.js命令行环境的loading效果，和显示各种状态的图标等
+const package = require('../package.json')
+const chalk = require('chalk') // 支持修改控制台中字符串的样式 字体样式、字体颜色、背景颜色
+const {checkNodeVersion} = require('../helpers/cli')
+checkNodeVersion(package.engines.node, 'emp')
+/* console.log(chalk.bold('====== EMP 微前端 ======'))
+console.log(chalk.bold('@efox/emp-cli') + ' [ ' + chalk.green.bold(package.version) + ' ]')
+console.log(chalk.bold('webpack') + ' [ ' + chalk.green.bold(package.dependencies.webpack) + ' ]')
+console.log(chalk.bold('typescript') + ' [ ' + chalk.green.bold(package.dependencies.typescript) + ' ]')
+console.log(chalk.bold('====== ====== ====== ======')) */
+const Table = require('cli-table3')
+const table = new Table({
+  head: ['Emp & Deps', 'Version'],
+  style: {head: ['cyan']},
+  chars: {
+    top: '═',
+    'top-mid': '╤',
+    'top-left': '╔',
+    'top-right': '╗',
+    bottom: '═',
+    'bottom-mid': '╧',
+    'bottom-left': '╚',
+    'bottom-right': '╝',
+    left: '║',
+    'left-mid': '╟',
+    mid: '─',
+    'mid-mid': '┼',
+    right: '║',
+    'right-mid': '╢',
+    middle: '│',
+  },
+})
+table.push(['@efox/emp-cli', package.version])
+table.push(['webpack', package.dependencies.webpack])
+table.push(['typescript', package.dependencies.typescript])
+table.push(['postcss', package.dependencies.postcss])
+console.log(table.toString())
+//
+program.version(package.version, '-v, --version').usage('<command> [options]')
+
+//调试
+program
+  .command('dev')
+  // .alias('d')
+  .description('调试项目')
+  .option('-s, --src <src>', '目标文件 默认为 src/index.ts')
+  .option('-e, --env <env>', '部署环境 dev、test、prod 默认为 dev')
+  .option('-h, --hot', '是否使用热更新 默认不启动')
+  .option('-o, --open <open>', '是否打开调试页面 默认true,false禁止自动打开')
+  .option('-t, --ts', '生成类型文件 默认为 false')
+  .action(({src, env, hot, open, ts}) => {
+    const empEnv = env || 'dev'
+    open = open === 'false' ? false : true
+    require('../scripts/dev')({src, empEnv, hot, open, ts})
+  })
+// 构建
+program
+  .command('build')
+  // .alias('d')
+  .description('构建项目')
+  .option('-s, --src <src>', '目标文件 默认为 src/index.ts')
+  .option('-d, --dist <dist>', '目标 默认为 dist/')
+  .option('-e, --env <env>', '部署环境 dev、test、prod 默认为 prod')
+  .option('-a, --analyze', '生成分析报告 默认为 false')
+  .option('-t, --ts', '生成类型文件 默认为 false')
+  .option('-n, --createName <createName>', '文件名 默认为 index.d.ts [* 使用默认值方便同步]')
+  .option('-p, --createPath <createPath>', '相对命令行目录 默认为 dist')
+  .action(({src, dist, analyze, env, ts, createName, createPath}) => {
+    const empEnv = env || 'prod'
+    require('../scripts/build')({src, dist, analyze, empEnv, ts, createName, createPath})
+  })
+// 正式环境
+program
+  .command('serve')
+  // .alias('d')
+  .description('正式环境调试')
+  .option('-d, --dist <dist>', '目标 默认为 dist')
+  .action(({dist}) => {
+    require('../scripts/serve')({dist})
+  })
+// ts 类型构建
+program
+  .command('ts:create')
+  .alias('tsc')
+  .description('ts类型创建')
+  .option('-n, --createName <createName>', '文件名 默认为 index.d.ts [* 使用默认值更方便同步]')
+  .option('-p, --createPath <createPath>', '相对命令行目录 默认为 dist')
+  //
+  .action(({createName, createPath}) => {
+    require('../scripts/typescript')('create', {createName, createPath})
+  })
+// ts 类型同步
+program
+  .command('ts:sync <remoteUrl>')
+  .alias('tss')
+  .description('ts类型同步')
+  // .option('-u, --remoteUrl <remoteUrl>', '远程地址')
+  .option('-n, --saveName <saveName>', '保存名称 默认为 empType.d.ts')
+  .option('-p, --savePath <savePath>', '默认当前执行指令根目录的 src')
+  //
+  .action((remoteUrl, {saveName, savePath}) => {
+    require('../scripts/typescript')('sync', {remoteUrl, saveName, savePath})
+  })
+// 环境变量
+program
+  .command('info')
+  .description('查看当前运行环境')
+  .action(() => {
+    console.log(chalk.green.bold('\nEnvironment Info:'))
+    const spinner = ora('Start loading system configuration...').start()
+    // eninfo 获取系统的信息，设备信息，浏览器，node版本等
+    require('envinfo')
+      .run(
+        {
+          System: ['OS', 'CPU'],
+          Binaries: ['Node', 'Yarn', 'npm'],
+          Browsers: ['Chrome', 'Edge', 'Firefox', 'Safari'],
+          // npmPackages: '/**/{*efox*,@efox/*,*react*,@react/*/}',
+          npmGlobalPackages: ['@efox/emp-cli'],
+        },
+        {
+          showNotFound: true,
+          duplicates: true,
+          fullTree: true,
+        },
+      )
+      .then(res => {
+        console.log(chalk.green(res))
+        spinner.succeed('Loading system configuration is complete')
+      })
+  })
+
+//初始化项目
+program
+  .command('init <projectName>')
+  .description('初始化 emp 项目')
+  .action(projectName => {
+    require('../helpers/downloadRepo')(
+      'https://git.yy.com/webs/efox/template/emp-react-template.git',
+      `./${projectName}`,
+      '',
+    )
+    console.log('初始化完成，请输入:')
+    console.log(`cd ${projectName} && yarn && yarn dev`)
+  })
+
+// 执行命令
+program.parse(process.argv)