Merge branch 'development'

Author: givingwu

.npmignore

@@ -1,6 +1,7 @@
 /build
 /example
 /node_modules
+/packages
 /src
 /docs
 /old

packages/vue-cli-plugin-mfe/.gitignore

@@ -0,0 +1,44 @@
+target/
+!.mvn/wrapper/maven-wrapper.jar
+
+__test__
+
+# OS Files
+.DS_Store
+Thumbs.db
+
+# Dependencies
+node_modules/
+# demo or example files
+/example
+# portal pacakge files
+/pacakge
+
+# Local Env Files
+.env.local
+.env.*.local
+
+# Log Files
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# Unconfigured Editors
+.vscode
+.idea
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw*
+### IntelliJ IDEA ###
+.idea
+*.iws
+*.iml
+*.ipr
+# Editor directories and files
+*.suo
+*.ntvs*
+*.njsproj
+*.sln

packages/vue-cli-plugin-mfe/.npmignore

@@ -0,0 +1,10 @@
+/screenshots
+/__test__
+/node_modules
+.gitignore
+.npmrc
+*.log
+
+# OS Files
+.DS_Store
+Thumbs.db

packages/vue-cli-plugin-mfe/README.md

@@ -0,0 +1,66 @@
+---
+title: 介绍
+lang: zh-CN
+meta:
+  - name: description
+    content: vue-cli-plugin-mfe
+  - name: keywords
+    content: vue, vue-mfe, VUE-MFE, vue-cli-plugin-mfe
+---
+
+# vue-cli-plugin-mfe
+
+为 vue-mfe 的 domain-app 量身打造的 Vue-CLI3 插件.
+
+
+## FEATURES
+
+### 可选的主运行时
+支持可选的 `master-runtime` 配置，并根据是否选择 master 的配置生成相应的 `alias` 和 `entry`
+
+### 自动配置 linters
+集成 `eslint-standard`, `eslint-prettier`, `prettier/standard`, `prettier/vue`, `style-lint`, `vue-config` 等自动 lint 工具，无需再耗费心里手动维护配置依赖和规则
+
+### friendly alias
+根据 `aliases.config.js` 自动生成 VSCode friendly `jsconfig.json` 方便别名跳转 peek，无需手动去寻找/记住别名定义
+
+### vue-cli-service package
+`domain-app` 专属的打包命令，与原先的 `build` 命令做的事情非常类似。
+
++ 更改 package 时候的 webpack entry 和 plugins，以 `['./src/portal.entry.js', './src/routes', './src/router/routes.js', './src/routes.js', './src/main.js']` 为基础自动探测在执行 `package` 时 `webpack` 依赖的入口 `entry`。
++ 集成 `webpack-require-from` 指定 domain runtime 的 CDN `download` 主机地址
++ 集成 `webpack-manifest-plugin` 收集版本和 built 之后的文件信息
++ 集成 `node-archiver` 打成 `tar` 包并上传到指定的 `host`
++ 自动压缩打包📦文件成 `.tar.gz` 并上传到指定 package-server.
+
+
+## API
+
+查看用法:
+```bash
+vue-cli-service help package
+```
+
+```bash
+用法：'vue-cli-service package [options]'
+选项：{
+  description: 'Package to .tgr.gz and upload to server',
+  usage: 'vue-cli-service package [options]',
+  options: {
+    '--host': `specify package-server API url to upload bundled files`,
+    '--download': `specify package-server API url to download static files`,
+    '--name': `specify the name of current bundle package? default: ${PACKAGE_NAME}`,
+    '--output': `specify the output path of bundle files? default: package => ${cwd}/package`,
+    '--upload': `upload bundle file to server or not? default: true`,
+    '--json': `output bundle manifest json or not? default: true => manifest.json`,
+    '--disable-source-map': `disable source map. default: false`,
+  },
+}
+```
+
+
+## RUN
+
+```bash
+vue-cli-service package
+```

packages/vue-cli-plugin-mfe/commands/build.js

@@ -0,0 +1,112 @@
+/**
+ * inspired from:
+ * 1. https://github.com/vuejs/vue-cli/blob/dev/packages/%40vue/cli-service/lib/commands/build/index.js
+ * */
+'use strict'
+const webpack = require('webpack')
+const path = require('path')
+const rimraf = require('rimraf')
+const formatStats = require('@vue/cli-service/lib/commands/build/formatStats')
+
+const defaults = {
+  clean: true,
+  target: 'lib',
+  formats: 'commonjs,umd,umd-min',
+  'unsafe-inline': true,
+}
+
+const buildModes = {
+  lib: 'library',
+  wc: 'web component',
+  'wc-async': 'web component (async)',
+}
+
+module.exports = async function build(args, api, options) {
+  const {
+    chalk,
+    log,
+    done,
+    info,
+    logWithSpinner,
+    stopSpinner,
+  } = require('@vue/cli-shared-utils')
+
+  for (const key in defaults) {
+    if (args[key] == null) {
+      args[key] = defaults[key]
+    }
+  }
+
+  log()
+  const mode = api.service.mode
+  const targetDir = api.resolve(args.dest || args.output || options.outputDir)
+
+  if (args.target === 'app') {
+    const bundleTag = args.modern
+      ? args.modernBuild
+        ? `modern bundle `
+        : `legacy bundle `
+      : ``
+    logWithSpinner(`Building ${bundleTag}for ${mode}...`)
+  } else {
+    const buildMode = buildModes[args.target]
+
+    if (buildMode) {
+      const additionalParams =
+        buildMode === 'library' ? ` (${args.formats})` : ``
+      logWithSpinner(
+        `Building for ${mode} as ${buildMode}${additionalParams}...`
+      )
+    } else {
+      throw new Error(`Unknown build target: ${args.target}`)
+    }
+  }
+
+  return new Promise((resolve, reject) => {
+    rimraf(targetDir, (error) => {
+      if (error) return reject('Rimraf failed: ' + dest + ' => ' + error)
+      else {
+        webpack(api.resolveWebpackConfig(), (err, stats) => {
+          stopSpinner(false)
+
+          if (err) {
+            return reject(err)
+          }
+
+          if (stats.hasErrors()) {
+            return reject(`Build failed with errors.`)
+          }
+
+          if (!args.silent) {
+            const targetDirShort = path.relative(api.service.context, targetDir)
+            log(formatStats(stats, targetDirShort, api))
+
+            if (args.target === 'app' && !isLegacyBuild) {
+              if (!args.watch) {
+                done(
+                  `Build complete. The ${chalk.cyan(
+                    targetDirShort
+                  )} directory is ready to be deployed.`
+                )
+                info(
+                  `Check out deployment instructions at ${chalk.cyan(
+                    `https://cli.vuejs.org/guide/deployment.html`
+                  )}\n`
+                )
+              } else {
+                done(`Build complete. Watching for changes...`)
+              }
+            }
+          }
+
+          // test-only signal
+          if (process.env.VUE_CLI_TEST) {
+            console.log('Build complete.')
+          }
+
+          resolve()
+        })
+      }
+    })
+  })
+}

packages/vue-cli-plugin-mfe/commands/upload.js

@@ -0,0 +1,70 @@
+'use strict'
+
+const fs = require('fs')
+const FormData = require('form-data')
+const {
+  chalk,
+  log,
+  done,
+  info,
+  logWithSpinner,
+  stopSpinner
+} = require('@vue/cli-shared-utils')
+
+module.exports = async function(args, file) {
+  const name = args.name
+  const url = args.uploadUrl
+  const download = args.downloadUrl || args.uploadUrl
+  const fileSize = fs.statSync(file).size
+
+  log()
+  log(
+    JSON.stringify({
+      name,
+      uploadUrl: url,
+      downloadUrl: download,
+      file,
+      fileSize
+    })
+  )
+  log()
+
+  return new Promise((resolve, reject) => {
+    logWithSpinner(`start uploading ${name} to package-server ${url}...`)
+
+    const formData = new FormData({})
+
+    formData.append('file', fs.createReadStream(file), {
+      headers: { 'transfer-encoding': 'chunked' },
+      knownLength: fileSize
+    })
+
+    formData.submit(url, (err, res) => {
+      stopSpinner(false)
+
+      if (err) {
+        log(chalk.red(`Publish module ${chalk.cyan(name)} failed`))
+        log(chalk.red(err))
+        reject(err)
+
+        process.exit(1)
+      } else if (res.statusCode !== 200) {
+        log(chalk.red(`Publish module ${chalk.cyan(name)} failed`))
+        log(
+          chalk.red(
+            `Remote server ${url} Status error. Code: ${chalk.red(
+              res.statusCode
+            )}, Body: ${chalk.red(res.statusMessage)}`
+          )
+        )
+
+        process.exit(1)
+      } else {
+        done(`Upload module ${chalk.yellow(name)} complete.`)
+        info(`Checkout it out on package-server ${chalk.cyan(`${download}`)}`)
+
+        resolve(res.resume())
+      }
+    })
+  })
+}

packages/vue-cli-plugin-mfe/generator/index.js

@@ -0,0 +1,78 @@
+/**
+ * # Generator
+ * https://cli.vuejs.org/dev-guide/plugin-dev.html#generator
+ * [Generator API Source Code](https://github.com/vuejs/vue-cli/blob/dev/packages/%40vue/cli/lib/GeneratorAPI.js)
+ *
+ * + #entry It will be invoked in two possible scenarios:
+ *  1. During a project's initial creation, if the CLI plugin is installed as part of the project creation preset.
+ *  2. When the plugin is installed after project's creation and invoked individually via vue add or `vue invoke`.
+ *
+ * + #usage
+ *  1. see [creating new templates、files or edit existing ones](https://cli.vuejs.org/dev-guide/plugin-dev.html#creating-new-templates)
+ *  2. see [filename edge cases](https://cli.vuejs.org/dev-guide/plugin-dev.html#filename-edge-cases)
+ *  3. see [extending package](https://cli.vuejs.org/dev-guide/plugin-dev.html#extending-package)
+ *  4. see [changing main file](https://cli.vuejs.org/dev-guide/plugin-dev.html#changing-main-file)
+ *
+ * + #params A generator should export a function which receives three arguments:
+ *  1. A [Generator API](https://cli.vuejs.org/dev-guide/generator-api.html#generator-api) instance;
+ *  2. The generator options for this plugin.
+ *   2.1 These options are resolved during the prompt phase of project creation,
+ *   2.2 or loaded from a saved preset in [~/.vuerc](~/.vuerc).
+ */
+
+module.exports = (api /* see #params.1 */, options /* see #params.2 */) => {
+  const {
+    useMasterRuntime,
+    masterRuntimeName,
+    masterRuntimeVersion,
+    domainRoutePrefix,
+  } = options
+
+  api.extendPackage({
+    scripts: {
+      package: 'vue-cli-service package',
+      start: 'npm run serve',
+      dev: 'npm run serve',
+    },
+    devDependencies: {
+      '@vue/eslint-config-prettier': '^4.0.1',
+      '@vue/eslint-config-standard': '^4.0.0',
+    },
+  })
+
+  /* see #usage.1 [creating new templates] */
+  /* see #usage.2 [filename edge cases] */
+  if (useMasterRuntime) {
+    api.render('./template', {
+      masterRuntimeName,
+      domainRoutePrefix,
+    })
+
+    // https://cli.vuejs.org/dev-guide/plugin-dev.html#service-plugin
+    // An object containing project local options specified in vue.config.js, or in the "vue" field in package.json.
+    api.extendPackage({
+      dependencies: {
+        [masterRuntimeName]: masterRuntimeVersion,
+      },
+      'portal-config': {
+        useMasterRuntime,
+        masterRuntimeName,
+        masterRuntimeVersion,
+        domainRoutePrefix,
+      },
+    })
+
+    api.onCreateComplete(() => {
+      const fs = require('fs')
+      const entryJSFile = api.resolve('src/main.js')
+      if (fs.existsSync(entryJSFile)) {
+        fs.unlinkSync(entryJSFile)
+      }
+
+      const appVueFile = api.resolve('src/App.vue')
+      if (fs.existsSync(appVueFile)) {
+        fs.unlinkSync(appVueFile)
+      }
+    })
+  }
+}