Initial commit

commands/add.js

+const {
+    info
+  } = require('@vue/cli-shared-utils')
+  
+  const path = require('path')
+  const resolve = require('resolve')
+  const chalk = require('chalk')
+  const copy = require('copy')
+  const baseDir = resolve.sync('vue-cli-plugin-multi-pages', { basedir: process.cwd() })
+  const source = path.resolve(path.dirname(baseDir), 'generator/template/**')
+  const dist = 'src/pages/'
+  
+  module.exports = (api, options) => {
+    api.registerCommand('add', {
+      description: 'add a new page',
+      usage: 'vue-cli-service add [page]',
+    }, async function serve (args) {
+      info('Adding a new page...')
+  
+      // entry arg
+      const entry = args._[0]
+      // api.resolve(dist + entry)
+      if (entry) {
+        copy(source, api.resolve(dist + entry), function(err, files) {
+          if (err) throw err;
+          // `files` is an array of the files that were copied
+          console.log(chalk.yellow(`页面${entry}创建成功！`))
+        });
+      } else {
+          console.log(chalk.red(`npm run add [page] 缺失参数: page`))
+      }
+    })
+  }
+  
\ No newline at end of file

commands/build.js

+const glob = require('glob')
+const path = require('path')
+const defaults = {
+  clean: true,
+  target: 'app',
+  formats: 'commonjs,umd,umd-min',
+  'unsafe-inline': true
+}
+
+const buildModes = {
+  lib: 'library',
+  wc: 'web component',
+  'wc-async': 'web component (async)'
+}
+
+const modifyConfig = (config, fn) => {
+  if (Array.isArray(config)) {
+    config.forEach(c => fn(c))
+  } else {
+    fn(config)
+  }
+}
+
+module.exports = (api, options) => {
+  api.registerCommand('build', {
+    description: 'build for production',
+    usage: 'vue-cli-service build [options] [entry|pattern]',
+    options: {
+      '--mode': `specify env mode (default: production)`,
+      '--dest': `specify output directory (default: ${options.outputDir})`,
+      '--modern': `build app targeting modern browsers with auto fallback`,
+      '--no-unsafe-inline': `build app without introducing inline scripts`,
+      '--target': `app | lib | wc | wc-async (default: ${defaults.target})`,
+      '--formats': `list of output formats for library builds (default: ${defaults.formats})`,
+      '--name': `name for lib or web-component mode (default: "name" in package.json or entry filename)`,
+      '--filename': `file name for output, only usable for 'lib' target (default: value of --name)`,
+      '--no-clean': `do not remove the dist directory before building the project`,
+      '--report': `generate report.html to help analyze bundle content`,
+      '--report-json': 'generate report.json to help analyze bundle content',
+      '--watch': `watch for changes`
+    }
+  }, async (args, rawArgs) => {
+    for (const key in defaults) {
+      if (args[key] == null) {
+        args[key] = defaults[key]
+      }
+    }
+
+    // 拿到所有页面
+    const allPages = glob.sync('./src/pages/*').map(m=>m.replace('./src/pages/', '').replace('/', '')).filter(item=> item!=='common');
+    const entry = args._[0]?args._[0].split('+'):''
+    let pages = []
+    if(entry && entry.length>0){
+      for (const item of entry) {
+        if(allPages.indexOf(item)>=0){
+          pages.push(item)
+        }
+      }
+    } else{
+      pages=allPages
+    }
+    
+    pages.forEach(async item => {
+      args.entry = item
+      if (args.target !== 'app') {
+        args.entry = args.entry || 'src/App.vue'
+      }
+
+      process.env.VUE_CLI_BUILD_TARGET = args.target
+      if (args.modern && args.target === 'app') {
+        process.env.VUE_CLI_MODERN_MODE = true
+        if (!process.env.VUE_CLI_MODERN_BUILD) {
+          // main-process for legacy build
+          await build(Object.assign({}, args, {
+            modernBuild: false,
+            keepAlive: true
+          }), api, options)
+          // spawn sub-process of self for modern build
+          const { execa } = require('@vue/cli-shared-utils')
+          const cliBin = require('path').resolve(__dirname, '../../../bin/vue-cli-service.js')
+          await execa(cliBin, ['build', ...rawArgs], {
+            stdio: 'inherit',
+            env: {
+              VUE_CLI_MODERN_BUILD: true
+            }
+          })
+        } else {
+          // sub-process for modern build
+          await build(Object.assign({}, args, {
+            modernBuild: true,
+            clean: false
+          }), api, options)
+        }
+        delete process.env.VUE_CLI_MODERN_MODE
+      } else {
+        if (args.modern) {
+          const { warn } = require('@vue/cli-shared-utils')
+          warn(
+            `Modern mode only works with default target (app). ` +
+            `For libraries or web components, use the browserslist ` +
+            `config to specify target browsers.`
+          )
+        }
+        await build(args, api, options)
+      }
+      delete process.env.VUE_CLI_BUILD_TARGET
+      })
+    })
+}
+
+async function build (args, api, options) {
+  const fs = require('fs-extra')
+  const path = require('path')
+  const chalk = require('chalk')
+  const webpack = require('webpack')
+  const formatStats = require('../util/formatStats')
+  const validateWebpackConfig = require('../util/validateWebpackConfig')
+  const {
+    log,
+    done,
+    info,
+    logWithSpinner,
+    stopSpinner
+  } = require('@vue/cli-shared-utils')
+
+  log()
+  const mode = api.service.mode
+  if (args.target === 'app') {
+    const bundleTag = args.modern
+      ? args.modernBuild
+        ? `modern bundle `
+        : `legacy bundle `
+      : ``
+    logWithSpinner(`Building ${args.entry} ${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}`)
+    }
+  }
+
+  const targetDir = api.resolve(args.dest || options.outputDir) + '/' + args.entry
+  const isLegacyBuild = args.target === 'app' && args.modern && !args.modernBuild
+
+  // resolve raw webpack config
+  let webpackConfig
+  if (args.target === 'lib') {
+    webpackConfig = require('./resolveLibConfig')(api, args, options)
+  } else if (
+    args.target === 'wc' ||
+    args.target === 'wc-async'
+  ) {
+    webpackConfig = require('./resolveWcConfig')(api, args, options)
+  } else {
+    webpackConfig = require('../util/resolveAppConfig')(api, args, options)
+  }
+
+  // check for common config errors
+  validateWebpackConfig(webpackConfig, api, options, args.target)
+
+  const entry = args.entry  // 1
+  if (entry) {
+    const pagesPath = "./src/pages/" + entry // 1，增加模块路径
+    webpackConfig.entry = {
+      // app: api.resolve(entry)
+      app: pagesPath + '/main' // 2，修改entry入口
+    }
+    webpackConfig.output.publicPath = ''
+    webpackConfig.output.path = targetDir
+    for(let item of webpackConfig.plugins) {
+      if (item.options && item.options.template) item.options.template= pagesPath + '/main.html'  // 3，修改webpackConfig.plugins.HtmlWebpackPlugin template 入口
+    }
+  }
+
+  // apply inline dest path after user configureWebpack hooks
+  // so it takes higher priority
+  if (args.dest) {
+    modifyConfig(webpackConfig, config => {
+      config.output.path = targetDir
+    })
+  }
+
+  if (args.watch) {
+    modifyConfig(webpackConfig, config => {
+      config.watch = true
+    })
+  }
+
+  // Expose advanced stats
+  if (args.dashboard) {
+    const DashboardPlugin = require('../../webpack/DashboardPlugin')
+    modifyConfig(webpackConfig, config => {
+      config.plugins.push(new DashboardPlugin({
+        type: 'build',
+        modernBuild: args.modernBuild,
+        keepAlive: args.keepAlive
+      }))
+    })
+  }
+
+  if (args.report || args['report-json']) {
+    const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer')
+    modifyConfig(webpackConfig, config => {
+      const bundleName = args.target !== 'app'
+        ? config.output.filename.replace(/\.js$/, '-')
+        : isLegacyBuild ? 'legacy-' : ''
+      config.plugins.push(new BundleAnalyzerPlugin({
+        logLevel: 'warn',
+        openAnalyzer: false,
+        analyzerMode: args.report ? 'static' : 'disabled',
+        reportFilename: `${bundleName}report.html`,
+        statsFilename: `${bundleName}report.json`,
+        generateStatsFile: !!args['report-json']
+      }))
+    })
+  }
+
+  if (args.clean) {
+    await fs.remove(targetDir)
+  }
+
+  return new Promise((resolve, reject) => {
+    webpack(webpackConfig, (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()
+    })
+  })
+}
+
+module.exports.defaultModes = {
+  build: 'production'
+}

generator/index.js

+module.exports = (api, options, rootOptions) => {
+    // 修改 `package.json` 里的字段
+    api.extendPackage({
+      scripts: {
+        start: 'vue-cli-service serve',
+        build: 'vue-cli-service build',
+        add: 'vue-cli-service add'
+      }
+    })
+  
+    // 复制并用 ejs 渲染 `./template` 内所有的文件
+    api.render('./template', {
+      doesCompile: api.hasPlugin('babel') || api.hasPlugin('typescript')
+    })
+  
+    // if (options.foo) {
+    //   // 有条件地生成文件
+    // }
+  
+    // 根据eslint配置自动校正
+    api.onCreateComplete(() => {
+      // Linting the generated files
+      if (api.hasPlugin('eslint')) {
+        // Lint generated/modified files
+        try {
+          const lint = require('@vue/cli-plugin-eslint/lint')
+          lint({ silent: true }, api)
+        } catch (e) {
+          // No ESLint vue-cli plugin
+        }
+      }
+    })  
+    
+  }
\ No newline at end of file

generator/template/ejs/App.vue

+<%_ if (!rootOptions.router) { _%>
+<template>
+  <div id="app">
+    <img alt="Vue logo" src="./assets/logo.png">
+    <%_ if (!rootOptions.bare) { _%>
+    <HelloWorld msg="Welcome to Your Vue.js App"/>
+    <%_ } else { _%>
+    <h1>Welcome to Your Vue.js App</h1>
+    <%_ } _%>
+  </div>
+</template>
+  <%_ if (!rootOptions.bare) { _%>
+
+<script>
+import HelloWorld from './components/HelloWorld.vue'
+
+export default {
+  name: 'app',
+  components: {
+    HelloWorld
+  }
+}
+</script>
+  <%_ } _%>
+<%_ } else { _%>
+<template>
+  <div id="app">
+    <div id="nav">
+      <router-link to="/">Home</router-link> |
+      <router-link to="/about">About</router-link>
+    </div>
+    <router-view/>
+  </div>
+</template>
+<%_ } _%>
+<%_ if (!rootOptions.bare) { _%>
+<%_ if (rootOptions.cssPreprocessor !== 'stylus') { _%>
+
+<style<%-
+  rootOptions.cssPreprocessor
+    ? ` lang="${
+        rootOptions.cssPreprocessor === 'sass'
+          ? 'scss'
+          : rootOptions.cssPreprocessor
+      }"`
+    : ``
+%>>
+#app {
+  font-family: 'Avenir', Helvetica, Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  text-align: center;
+  color: #2c3e50;
+  <%_ if (!rootOptions.router) { _%>
+  margin-top: 60px;
+  <%_ } _%>
+}
+<%_ if (rootOptions.router) { _%>
+  <%_ if (!rootOptions.cssPreprocessor) { _%>
+#nav {
+  padding: 30px;
+}
+
+#nav a {
+  font-weight: bold;
+  color: #2c3e50;
+}
+
+#nav a.router-link-exact-active {
+  color: #42b983;
+}
+  <%_ } else { _%>
+#nav {
+  padding: 30px;
+  a {
+    font-weight: bold;
+    color: #2c3e50;
+    &.router-link-exact-active {
+      color: #42b983;
+    }
+  }
+}
+  <%_ } _%>
+<%_ } _%>
+</style>
+<%_ } else { _%>
+<style lang="stylus">
+#app
+  font-family 'Avenir', Helvetica, Arial, sans-serif
+  -webkit-font-smoothing antialiased
+  -moz-osx-font-smoothing grayscale
+  text-align center
+  color #2c3e50
+  <%_ if (!rootOptions.router) { _%>
+  margin-top 60px
+  <%_ } _%>
+<%_ if (rootOptions.router) { _%>
+
+#nav
+  padding 30px
+  a
+    font-weight bold
+    color #2c3e50
+    &.router-link-exact-active
+      color #42b983
+<%_ } _%>
+</style>
+<%_ } _%>
+<%_ } _%>

generator/template/ejs/components/HelloWorld.vue

+<%_ if (!rootOptions.bare) { _%>
+<template>
+  <div class="hello">
+    <h1>{{ msg }}</h1>
+    <p>
+      For guide and recipes on how to configure / customize this project,<br>
+      check out the
+      <a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
+    </p>
+    <h3>Installed CLI Plugins</h3>
+    <ul>
+      <%_ for (plugin of plugins) { _%>
+      <li><a href="<%- plugin.link %>" target="_blank" rel="noopener"><%- plugin.name %></a></li>
+      <%_ } _%>
+    </ul>
+    <h3>Essential Links</h3>
+    <ul>
+      <li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
+      <li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
+      <li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
+      <li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
+      <li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
+    </ul>
+    <h3>Ecosystem</h3>
+    <ul>
+      <li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
+      <li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
+      <li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
+      <li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
+      <li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
+    </ul>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'HelloWorld',
+  props: {
+    msg: String
+  }
+}
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<%_ if (rootOptions.cssPreprocessor !== 'stylus') { _%>
+<style scoped<%-
+  rootOptions.cssPreprocessor
+    ? ` lang="${
+        rootOptions.cssPreprocessor === 'sass'
+          ? 'scss'
+          : rootOptions.cssPreprocessor
+      }"`
+    : ``
+%>>
+h3 {
+  margin: 40px 0 0;
+}
+ul {
+  list-style-type: none;
+  padding: 0;
+}
+li {
+  display: inline-block;
+  margin: 0 10px;
+}
+a {
+  color: #42b983;
+}
+</style>
+<%_ } else { _%>
+<style scoped lang="stylus">
+h3
+  margin 40px 0 0
+
+ul
+  list-style-type none
+  padding 0
+
+li
+  display inline-block
+  margin 0 10px
+
+a
+  color #42b983
+</style>
+<%_ } _%>
+<%_ } _%>

generator/template/ejs/index.html

+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width,initial-scale=1.0">
+    <link rel="icon" href="<%%= BASE_URL %%>favicon.ico">
+    <title><%= rootOptions.projectName %></title>
+  </head>
+  <body>
+    <noscript>
+      <strong>We're sorry but <%= rootOptions.projectName %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
+    </noscript>
+    <div id="app"></div>
+    <!-- built files will be auto injected -->
+  </body>
+</html>

generator/template/ejs/main.js

+import Vue from 'vue'
+import App from './App.vue'
+
+Vue.config.productionTip = false
+
+new Vue({
+  <%_ if (doesCompile) { _%>
+  render: h => h(App),
+  <%_ } else { _%>
+  render: function (h) { return h(App) },
+  <%_ } _%>
+}).$mount('#app')

generator/template/main.html

+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="utf-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width,initial-scale=1.0">
+  <%= htmlWebpackPlugin.options.header %>
+  <link rel="icon" href="<%= BASE_URL %>favicon.ico">
+  <title>标题</title>
+  <script>
+  </script>
+</head>
+
+<body>
+  <div id="app">
+  </div>
+</body>
+
+</html>
\ No newline at end of file

generator/template/main.ts

+import Vue from 'vue';
+import Main from './views/Main.vue';
+import axios from 'axios';
+import VueAxios from 'vue-axios';
+import '@/utils/common';
+
+const win = window as any;
+axios.defaults.withCredentials = true;
+axios.defaults.headers['Content-Type'] = 'application/json';
+Vue.use(VueAxios, axios);
+Vue.config.productionTip = false;
+
+new Vue({
+  name: 'module',
+  components: {
+    Main,
+  },
+  created() {
+  },
+  methods: {
+  },
+  render: (h) => h(Main),
+}).$mount('#app');

generator/template/views/Main.vue

+<template>
+  <div>
+    <HeaderBar>title</HeaderBar>
+  </div>
+</template>
+
+<script lang="ts">
+import { Component, Prop, Vue } from 'vue-property-decorator';
+import HeaderBar from '@/components/headerBar/index.vue';
+
+@Component({
+  components: {
+    HeaderBar,
+  },
+})
+export default class Home extends Vue {
+}
+</script>
+
+<style lang="scss" >
+@import 'sassHelper';
+</style>

index.js

+const build = require('./commands/build')
+const serve =  require('./commands/serve')
+const add =  require('./commands/add')
+module.exports = (api, opts) => {
+    build(api, opts)
+    serve(api,opts)
+    add(api,opts)
+}
\ No newline at end of file

package.json

+{
+  "name": "vue-cli-plugin-multi-pages",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "author": "",
+  "license": "ISC",
+  "devDependencies": {
+    "copy": "^0.3.2"
+  }
+}
\ No newline at end of file

util/formatStats.js

+module.exports = function formatStats (stats, dir, api) {
+    const fs = require('fs')
+    const path = require('path')
+    const zlib = require('zlib')
+    const chalk = require('chalk')
+    const ui = require('cliui')({ width: 80 })
+    const url  = require('url');
+  
+    const json = stats.toJson({
+      hash: false,
+      modules: false,
+      chunks: false
+    })
+  
+    let assets = json.assets
+      ? json.assets
+      : json.children.reduce((acc, child) => acc.concat(child.assets), [])
+  
+    const seenNames = new Map()
+    const isJS = val => /\.js$/.test(val)
+    const isCSS = val => /\.css$/.test(val)
+    const isMinJS = val => /\.min\.js$/.test(val)
+    assets = assets
+      .map(a => {
+        a.name = url.parse(a.name).pathname
+        return a
+      })
+      .filter(a => {
+        if (seenNames.has(a.name)) {
+          return false
+        }
+        seenNames.set(a.name, true)
+        return isJS(a.name) || isCSS(a.name)
+      })
+      .sort((a, b) => {
+        if (isJS(a.name) && isCSS(b.name)) return -1
+        if (isCSS(a.name) && isJS(b.name)) return 1
+        if (isMinJS(a.name) && !isMinJS(b.name)) return -1
+        if (!isMinJS(a.name) && isMinJS(b.name)) return 1
+        return b.size - a.size
+      })
+  
+    function formatSize (size) {
+      return (size / 1024).toFixed(2) + ' KiB'
+    }
+  
+    function getGzippedSize (asset) {
+      const filepath = api.resolve(path.join(dir, asset.name))
+      const buffer = fs.readFileSync(filepath)
+      return formatSize(zlib.gzipSync(buffer).length)
+    }
+  
+    function makeRow (a, b, c) {
+      return `  ${a}\t    ${b}\t ${c}`
+    }
+  
+    ui.div(
+      makeRow(
+        chalk.cyan.bold(`File`),
+        chalk.cyan.bold(`Size`),
+        chalk.cyan.bold(`Gzipped`)
+      ) + `\n\n` +
+      assets.map(asset => makeRow(
+        /js$/.test(asset.name)
+          ? chalk.green(path.join(dir, asset.name))
+          : chalk.blue(path.join(dir, asset.name)),
+        formatSize(asset.size),
+        getGzippedSize(asset)
+      )).join(`\n`)
+    )
+  
+    return `${ui.toString()}\n\n  ${chalk.gray(`Images and other types of assets omitted.`)}\n`
+  }
+  
\ No newline at end of file

util/getAssetPath.js

+const path = require('path')
+
+module.exports = function getAssetPath (options, filePath) {
+  return options.assetsDir
+    ? path.posix.join(options.assetsDir, filePath)
+    : filePath
+}

util/isAbsoluteUrl.js

+module.exports = function isAbsoluteUrl (url) {
+    // A URL is considered absolute if it begins with "<scheme>://" or "//"
+    return /^([a-z][a-z\d\+\-\.]*:)?\/\//i.test(url)
+  }
+  
\ No newline at end of file

util/prepareProxy.js

+/**
+ * Copyright (c) 2015-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file at
+ * https://github.com/facebookincubator/create-react-app/blob/master/LICENSE
+ */
+
+const fs = require('fs')
+const url = require('url')
+const path = require('path')
+const chalk = require('chalk')
+const address = require('address')
+
+const defaultConfig = {
+  logLevel: 'silent',
+  secure: false,
+  changeOrigin: true,
+  ws: true,
+  xfwd: true
+}
+
+module.exports = function prepareProxy (proxy, appPublicFolder) {
+  // `proxy` lets you specify alternate servers for specific requests.
+  // It can either be a string or an object conforming to the Webpack dev server proxy configuration
+  // https://webpack.github.io/docs/webpack-dev-server.html
+  if (!proxy) {
+    return undefined
+  }
+  if (Array.isArray(proxy) || (typeof proxy !== 'object' && typeof proxy !== 'string')) {
+    console.log(
+      chalk.red(
+        'When specified, "proxy" in package.json must be a string or an object.'
+      )
+    )
+    console.log(
+      chalk.red('Instead, the type of "proxy" was "' + typeof proxy + '".')
+    )
+    console.log(
+      chalk.red(
+        'Either remove "proxy" from package.json, or make it an object.'
+      )
+    )
+    process.exit(1)
+  }
+
+  // Otherwise, if proxy is specified, we will let it handle any request except for files in the public folder.
+  function mayProxy (pathname) {
+    const maybePublicPath = path.resolve(appPublicFolder, pathname.slice(1))
+    return !fs.existsSync(maybePublicPath)
+  }
+
+  function createProxyEntry (target, usersOnProxyReq, context) {
+    // #2478
+    // There're a little-known use case that the `target` field is an object rather than a string
+    // https://github.com/chimurai/http-proxy-middleware/blob/master/recipes/https.md
+    if (typeof target === 'string' && process.platform === 'win32') {
+      target = resolveLoopback(target)
+    }
+    return {
+      target,
+      context (pathname, req) {
+        // is a static asset
+        if (!mayProxy(pathname)) {
+          return false
+        }
+        if (context) {
+          // Explicit context, e.g. /api
+          return pathname.match(context)
+        } else {
+          // not a static request
+          if (req.method !== 'GET') {
+            return true
+          }
+          // Heuristics: if request `accept`s text/html, we pick /index.html.
+          // Modern browsers include text/html into `accept` header when navigating.
+          // However API calls like `fetch()` won’t generally accept text/html.
+          // If this heuristic doesn’t work well for you, use a custom `proxy` object.
+          return (
+            req.headers.accept &&
+            req.headers.accept.indexOf('text/html') === -1
+          )
+        }
+      },
+      onProxyReq (proxyReq, req, res) {
+        if (usersOnProxyReq) {
+          usersOnProxyReq(proxyReq, req, res)
+        }
+        // Browsers may send Origin headers even with same-origin
+        // requests. To prevent CORS issues, we have to change
+        // the Origin to match the target URL.
+        if (!proxyReq.agent && proxyReq.getHeader('origin')) {
+          proxyReq.setHeader('origin', target)
+        }
+      },
+      onError: onProxyError(target)
+    }
+  }
+
+  // Support proxy as a string for those who are using the simple proxy option
+  if (typeof proxy === 'string') {
+    if (!/^http(s)?:\/\//.test(proxy)) {
+      console.log(
+        chalk.red(
+          'When "proxy" is specified in package.json it must start with either http:// or https://'
+        )
+      )
+      process.exit(1)
+    }
+
+    return [
+      Object.assign({}, defaultConfig, createProxyEntry(proxy))
+    ]
+  }
+
+  // Otherwise, proxy is an object so create an array of proxies to pass to webpackDevServer
+  return Object.keys(proxy).map(context => {
+    const config = proxy[context]
+    if (!config.hasOwnProperty('target')) {
+      console.log(
+        chalk.red(
+          'When `proxy` in package.json is an object, each `context` object must have a ' +
+            '`target` property specified as a url string'
+        )
+      )
+      process.exit(1)
+    }
+    const entry = createProxyEntry(config.target, config.onProxyReq, context)
+    return Object.assign({}, defaultConfig, config, entry)
+  })
+}
+
+function resolveLoopback (proxy) {
+  const o = url.parse(proxy)
+  o.host = undefined
+  if (o.hostname !== 'localhost') {
+    return proxy
+  }
+  // Unfortunately, many languages (unlike node) do not yet support IPv6.
+  // This means even though localhost resolves to ::1, the application
+  // must fall back to IPv4 (on 127.0.0.1).
+  // We can re-enable this in a few years.
+  /* try {
+    o.hostname = address.ipv6() ? '::1' : '127.0.0.1';
+  } catch (_ignored) {
+    o.hostname = '127.0.0.1';
+  }*/
+
+  try {
+    // Check if we're on a network; if we are, chances are we can resolve
+    // localhost. Otherwise, we can just be safe and assume localhost is
+    // IPv4 for maximum compatibility.
+    if (!address.ip()) {
+      o.hostname = '127.0.0.1'
+    }
+  } catch (_ignored) {
+    o.hostname = '127.0.0.1'
+  }
+  return url.format(o)
+}
+
+// We need to provide a custom onError function for httpProxyMiddleware.
+// It allows us to log custom error messages on the console.
+function onProxyError (proxy) {
+  return (err, req, res) => {
+    const host = req.headers && req.headers.host
+    console.log(
+      chalk.red('Proxy error:') +
+        ' Could not proxy request ' +
+        chalk.cyan(req.url) +
+        ' from ' +
+        chalk.cyan(host) +
+        ' to ' +
+        chalk.cyan(proxy) +
+        '.'
+    )
+    console.log(
+      'See https://nodejs.org/api/errors.html#errors_common_system_errors for more information (' +
+        chalk.cyan(err.code) +
+        ').'
+    )
+    console.log()
+
+    // And immediately send the proper error response to the client.
+    // Otherwise, the request will eventually timeout with ERR_EMPTY_RESPONSE on the client side.
+    if (res.writeHead && !res.headersSent) {
+      res.writeHead(500)
+    }
+    res.end(
+      'Proxy error: Could not proxy request ' +
+        req.url +
+        ' from ' +
+        host +
+        ' to ' +
+        proxy +
+        ' (' +
+        err.code +
+        ').'
+    )
+  }
+}

util/prepareURLs.js

+/**
+ * Copyright (c) 2015-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file at
+ * https://github.com/facebookincubator/create-react-app/blob/master/LICENSE
+ */
+
+const url = require('url')
+const chalk = require('chalk')
+const address = require('address')
+const defaultGateway = require('default-gateway')
+
+module.exports = function prepareUrls (protocol, host, port, pathname = '/') {
+  const formatUrl = hostname =>
+    url.format({
+      protocol,
+      hostname,
+      port,
+      pathname
+    })
+  const prettyPrintUrl = hostname =>
+    url.format({
+      protocol,
+      hostname,
+      port: chalk.bold(port),
+      pathname
+    })
+
+  const isUnspecifiedHost = host === '0.0.0.0' || host === '::'
+  let prettyHost, lanUrlForConfig
+  let lanUrlForTerminal = chalk.gray('unavailable')
+  if (isUnspecifiedHost) {
+    prettyHost = 'localhost'
+    try {
+      // This can only return an IPv4 address
+      const result = defaultGateway.v4.sync()
+      lanUrlForConfig = address.ip(result && result.interface)
+      if (lanUrlForConfig) {
+        // Check if the address is a private ip
+        // https://en.wikipedia.org/wiki/Private_network#Private_IPv4_address_spaces
+        if (
+          /^10[.]|^172[.](1[6-9]|2[0-9]|3[0-1])[.]|^192[.]168[.]/.test(
+            lanUrlForConfig
+          )
+        ) {
+          // Address is private, format it for later use
+          lanUrlForTerminal = prettyPrintUrl(lanUrlForConfig)
+        } else {
+          // Address is not private, so we will discard it
+          lanUrlForConfig = undefined
+        }
+      }
+    } catch (_e) {
+      // ignored
+    }
+  } else {
+    prettyHost = host
+    lanUrlForConfig = host
+    lanUrlForTerminal = prettyPrintUrl(lanUrlForConfig)
+  }
+  const localUrlForTerminal = prettyPrintUrl(prettyHost)
+  const localUrlForBrowser = formatUrl(prettyHost)
+  return {
+    lanUrlForConfig,
+    lanUrlForTerminal,
+    localUrlForTerminal,
+    localUrlForBrowser
+  }
+}

util/resolveAppConfig.js

+module.exports = (api, args, options) => {
+    const config = api.resolveChainableWebpackConfig()
+    const targetDir = api.resolve(args.dest || options.outputDir)
+  
+    // respect inline build destination in copy plugin
+    if (args.dest && config.plugins.has('copy')) {
+      config.plugin('copy').tap(args => {
+        args[0][0].to = targetDir
+        return args
+      })
+    }
+  
+    if (args.modern) {
+      const ModernModePlugin = require('../../webpack/ModernModePlugin')
+      if (!args.modernBuild) {
+        // Inject plugin to extract build stats and write to disk
+        config
+          .plugin('modern-mode-legacy')
+          .use(ModernModePlugin, [{
+            targetDir,
+            isModernBuild: false,
+            unsafeInline: args['unsafe-inline']
+          }])
+      } else {
+        // Inject plugin to read non-modern build stats and inject HTML
+        config
+          .plugin('modern-mode-modern')
+          .use(ModernModePlugin, [{
+            targetDir,
+            isModernBuild: true,
+            unsafeInline: args['unsafe-inline'],
+            // as we may generate an addition file asset (if `no-unsafe-inline` specified)
+            // we need to provide the correct directory for that file to place in
+            jsDirectory: require('vue-cli-plugin-multi-pages/util/getAssetPath')(options, 'js')
+          }])
+      }
+    }
+  
+    const rawConfig = api.resolveWebpackConfig(config)
+  
+    // respect inline entry
+    if (args.entry && !options.pages) {
+      rawConfig.entry = { app: api.resolve(args.entry) }
+    }
+    return rawConfig
+  }
+  
\ No newline at end of file

util/validateWebpackConfig.js

+module.exports = function validateWebpackConfig (
+    webpackConfig,
+    api,
+    options,
+    target = 'app'
+  ) {
+    const singleConfig = Array.isArray(webpackConfig)
+      ? webpackConfig[0]
+      : webpackConfig
+  
+    const actualTargetDir = singleConfig.output.path
+  
+    if (actualTargetDir !== api.resolve(options.outputDir)) {
+      // user directly modifies output.path in configureWebpack or chainWebpack.
+      // this is not supported because there's no way for us to give copy
+      // plugin the correct value this way.
+      throw new Error(
+        `\n\nConfiguration Error: ` +
+        `Avoid modifying webpack output.path directly. ` +
+        `Use the "outputDir" option instead.\n`
+      )
+    }
+  
+    if (actualTargetDir === api.service.context) {
+      throw new Error(
+        `\n\nConfiguration Error: ` +
+        `Do not set output directory to project root.\n`
+      )
+    }
+  
+    if (target === 'app' && singleConfig.output.publicPath !== options.publicPath) {
+      throw new Error(
+        `\n\nConfiguration Error: ` +
+        `Avoid modifying webpack output.publicPath directly. ` +
+        `Use the "publicPath" option instead.\n`
+      )
+    }
+  }
+  
\ No newline at end of file