[release]4.1.0 (#211)
This commit is contained in:
		@@ -1,45 +0,0 @@
 | 
			
		||||
'use strict'
 | 
			
		||||
require('./check-versions')()
 | 
			
		||||
 | 
			
		||||
process.env.NODE_ENV = 'production'
 | 
			
		||||
 | 
			
		||||
const ora = require('ora')
 | 
			
		||||
const rm = require('rimraf')
 | 
			
		||||
const path = require('path')
 | 
			
		||||
const chalk = require('chalk')
 | 
			
		||||
const webpack = require('webpack')
 | 
			
		||||
const config = require('../config')
 | 
			
		||||
const webpackConfig = require('./webpack.prod.conf')
 | 
			
		||||
 | 
			
		||||
const spinner = ora('building for production...')
 | 
			
		||||
spinner.start()
 | 
			
		||||
 | 
			
		||||
rm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), err => {
 | 
			
		||||
  if (err) throw err
 | 
			
		||||
  webpack(webpackConfig, (err, stats) => {
 | 
			
		||||
    spinner.stop()
 | 
			
		||||
    if (err) throw err
 | 
			
		||||
    process.stdout.write(
 | 
			
		||||
      stats.toString({
 | 
			
		||||
        colors: true,
 | 
			
		||||
        modules: false,
 | 
			
		||||
        children: false,
 | 
			
		||||
        chunks: false,
 | 
			
		||||
        chunkModules: false
 | 
			
		||||
      }) + '\n\n'
 | 
			
		||||
    )
 | 
			
		||||
 | 
			
		||||
    if (stats.hasErrors()) {
 | 
			
		||||
      console.log(chalk.red('  Build failed with errors.\n'))
 | 
			
		||||
      process.exit(1)
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    console.log(chalk.cyan('  Build complete.\n'))
 | 
			
		||||
    console.log(
 | 
			
		||||
      chalk.yellow(
 | 
			
		||||
        '  Tip: built files are meant to be served over an HTTP server.\n' +
 | 
			
		||||
          "  Opening index.html over file:// won't work.\n"
 | 
			
		||||
      )
 | 
			
		||||
    )
 | 
			
		||||
  })
 | 
			
		||||
})
 | 
			
		||||
@@ -1,64 +0,0 @@
 | 
			
		||||
'use strict'
 | 
			
		||||
const chalk = require('chalk')
 | 
			
		||||
const semver = require('semver')
 | 
			
		||||
const packageConfig = require('../package.json')
 | 
			
		||||
const shell = require('shelljs')
 | 
			
		||||
 | 
			
		||||
function exec(cmd) {
 | 
			
		||||
  return require('child_process')
 | 
			
		||||
    .execSync(cmd)
 | 
			
		||||
    .toString()
 | 
			
		||||
    .trim()
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const versionRequirements = [
 | 
			
		||||
  {
 | 
			
		||||
    name: 'node',
 | 
			
		||||
    currentVersion: semver.clean(process.version),
 | 
			
		||||
    versionRequirement: packageConfig.engines.node
 | 
			
		||||
  }
 | 
			
		||||
]
 | 
			
		||||
 | 
			
		||||
if (shell.which('npm')) {
 | 
			
		||||
  versionRequirements.push({
 | 
			
		||||
    name: 'npm',
 | 
			
		||||
    currentVersion: exec('npm --version'),
 | 
			
		||||
    versionRequirement: packageConfig.engines.npm
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
module.exports = function() {
 | 
			
		||||
  const warnings = []
 | 
			
		||||
 | 
			
		||||
  for (let i = 0; i < versionRequirements.length; i++) {
 | 
			
		||||
    const mod = versionRequirements[i]
 | 
			
		||||
 | 
			
		||||
    if (!semver.satisfies(mod.currentVersion, mod.versionRequirement)) {
 | 
			
		||||
      warnings.push(
 | 
			
		||||
        mod.name +
 | 
			
		||||
          ': ' +
 | 
			
		||||
          chalk.red(mod.currentVersion) +
 | 
			
		||||
          ' should be ' +
 | 
			
		||||
          chalk.green(mod.versionRequirement)
 | 
			
		||||
      )
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  if (warnings.length) {
 | 
			
		||||
    console.log('')
 | 
			
		||||
    console.log(
 | 
			
		||||
      chalk.yellow(
 | 
			
		||||
        'To use this template, you must update following to modules:'
 | 
			
		||||
      )
 | 
			
		||||
    )
 | 
			
		||||
    console.log()
 | 
			
		||||
 | 
			
		||||
    for (let i = 0; i < warnings.length; i++) {
 | 
			
		||||
      const warning = warnings[i]
 | 
			
		||||
      console.log('  ' + warning)
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    console.log()
 | 
			
		||||
    process.exit(1)
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										35
									
								
								build/index.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										35
									
								
								build/index.js
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,35 @@
 | 
			
		||||
const { run } = require('runjs')
 | 
			
		||||
const chalk = require('chalk')
 | 
			
		||||
const config = require('../vue.config.js')
 | 
			
		||||
const rawArgv = process.argv.slice(2)
 | 
			
		||||
const args = rawArgv.join(' ')
 | 
			
		||||
 | 
			
		||||
if (process.env.npm_config_preview || rawArgv.includes('--preview')) {
 | 
			
		||||
  const report = rawArgv.includes('--report')
 | 
			
		||||
 | 
			
		||||
  run(`vue-cli-service build ${args}`)
 | 
			
		||||
 | 
			
		||||
  const port = 9526
 | 
			
		||||
  const publicPath = config.publicPath
 | 
			
		||||
 | 
			
		||||
  var connect = require('connect')
 | 
			
		||||
  var serveStatic = require('serve-static')
 | 
			
		||||
  const app = connect()
 | 
			
		||||
 | 
			
		||||
  app.use(
 | 
			
		||||
    publicPath,
 | 
			
		||||
    serveStatic('./dist', {
 | 
			
		||||
      index: ['index.html', '/']
 | 
			
		||||
    })
 | 
			
		||||
  )
 | 
			
		||||
 | 
			
		||||
  app.listen(port, function () {
 | 
			
		||||
    console.log(chalk.green(`> Preview at  http://localhost:${port}${publicPath}`))
 | 
			
		||||
    if (report) {
 | 
			
		||||
      console.log(chalk.green(`> Report at  http://localhost:${port}${publicPath}report.html`))
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
  })
 | 
			
		||||
} else {
 | 
			
		||||
  run(`vue-cli-service build ${args}`)
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										
											BIN
										
									
								
								build/logo.png
									
									
									
									
									
								
							
							
						
						
									
										
											BIN
										
									
								
								build/logo.png
									
									
									
									
									
								
							
										
											Binary file not shown.
										
									
								
							| 
		 Before Width: | Height: | Size: 6.7 KiB  | 
							
								
								
									
										108
									
								
								build/utils.js
									
									
									
									
									
								
							
							
						
						
									
										108
									
								
								build/utils.js
									
									
									
									
									
								
							@@ -1,108 +0,0 @@
 | 
			
		||||
'use strict'
 | 
			
		||||
const path = require('path')
 | 
			
		||||
const config = require('../config')
 | 
			
		||||
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
 | 
			
		||||
const packageConfig = require('../package.json')
 | 
			
		||||
 | 
			
		||||
exports.assetsPath = function(_path) {
 | 
			
		||||
  const assetsSubDirectory =
 | 
			
		||||
    process.env.NODE_ENV === 'production'
 | 
			
		||||
      ? config.build.assetsSubDirectory
 | 
			
		||||
      : config.dev.assetsSubDirectory
 | 
			
		||||
 | 
			
		||||
  return path.posix.join(assetsSubDirectory, _path)
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
exports.cssLoaders = function(options) {
 | 
			
		||||
  options = options || {}
 | 
			
		||||
 | 
			
		||||
  const cssLoader = {
 | 
			
		||||
    loader: 'css-loader',
 | 
			
		||||
    options: {
 | 
			
		||||
      sourceMap: options.sourceMap
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  const postcssLoader = {
 | 
			
		||||
    loader: 'postcss-loader',
 | 
			
		||||
    options: {
 | 
			
		||||
      sourceMap: options.sourceMap
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  // generate loader string to be used with extract text plugin
 | 
			
		||||
  function generateLoaders(loader, loaderOptions) {
 | 
			
		||||
    const loaders = []
 | 
			
		||||
 | 
			
		||||
    // Extract CSS when that option is specified
 | 
			
		||||
    // (which is the case during production build)
 | 
			
		||||
    if (options.extract) {
 | 
			
		||||
      loaders.push(MiniCssExtractPlugin.loader)
 | 
			
		||||
    } else {
 | 
			
		||||
      loaders.push('vue-style-loader')
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    loaders.push(cssLoader)
 | 
			
		||||
 | 
			
		||||
    if (options.usePostCSS) {
 | 
			
		||||
      loaders.push(postcssLoader)
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    if (loader) {
 | 
			
		||||
      loaders.push({
 | 
			
		||||
        loader: loader + '-loader',
 | 
			
		||||
        options: Object.assign({}, loaderOptions, {
 | 
			
		||||
          sourceMap: options.sourceMap
 | 
			
		||||
        })
 | 
			
		||||
      })
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    return loaders
 | 
			
		||||
  }
 | 
			
		||||
  // https://vue-loader.vuejs.org/en/configurations/extract-css.html
 | 
			
		||||
  return {
 | 
			
		||||
    css: generateLoaders(),
 | 
			
		||||
    postcss: generateLoaders(),
 | 
			
		||||
    less: generateLoaders('less'),
 | 
			
		||||
    sass: generateLoaders('sass', {
 | 
			
		||||
      indentedSyntax: true
 | 
			
		||||
    }),
 | 
			
		||||
    scss: generateLoaders('sass'),
 | 
			
		||||
    stylus: generateLoaders('stylus'),
 | 
			
		||||
    styl: generateLoaders('stylus')
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// Generate loaders for standalone style files (outside of .vue)
 | 
			
		||||
exports.styleLoaders = function(options) {
 | 
			
		||||
  const output = []
 | 
			
		||||
  const loaders = exports.cssLoaders(options)
 | 
			
		||||
 | 
			
		||||
  for (const extension in loaders) {
 | 
			
		||||
    const loader = loaders[extension]
 | 
			
		||||
    output.push({
 | 
			
		||||
      test: new RegExp('\\.' + extension + '$'),
 | 
			
		||||
      use: loader
 | 
			
		||||
    })
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  return output
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
exports.createNotifierCallback = () => {
 | 
			
		||||
  const notifier = require('node-notifier')
 | 
			
		||||
 | 
			
		||||
  return (severity, errors) => {
 | 
			
		||||
    if (severity !== 'error') return
 | 
			
		||||
 | 
			
		||||
    const error = errors[0]
 | 
			
		||||
    const filename = error.file && error.file.split('!').pop()
 | 
			
		||||
 | 
			
		||||
    notifier.notify({
 | 
			
		||||
      title: packageConfig.name,
 | 
			
		||||
      message: severity + ': ' + error.name,
 | 
			
		||||
      subtitle: filename || '',
 | 
			
		||||
      icon: path.join(__dirname, 'logo.png')
 | 
			
		||||
    })
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
@@ -1,5 +0,0 @@
 | 
			
		||||
'use strict'
 | 
			
		||||
 | 
			
		||||
module.exports = {
 | 
			
		||||
  //You can set the vue-loader configuration by yourself.
 | 
			
		||||
}
 | 
			
		||||
@@ -1,108 +0,0 @@
 | 
			
		||||
'use strict'
 | 
			
		||||
const path = require('path')
 | 
			
		||||
const utils = require('./utils')
 | 
			
		||||
const config = require('../config')
 | 
			
		||||
const { VueLoaderPlugin } = require('vue-loader')
 | 
			
		||||
const vueLoaderConfig = require('./vue-loader.conf')
 | 
			
		||||
 | 
			
		||||
function resolve(dir) {
 | 
			
		||||
  return path.join(__dirname, '..', dir)
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const createLintingRule = () => ({
 | 
			
		||||
  test: /\.(js|vue)$/,
 | 
			
		||||
  loader: 'eslint-loader',
 | 
			
		||||
  enforce: 'pre',
 | 
			
		||||
  include: [resolve('src'), resolve('test')],
 | 
			
		||||
  options: {
 | 
			
		||||
    formatter: require('eslint-friendly-formatter'),
 | 
			
		||||
    emitWarning: !config.dev.showEslintErrorsInOverlay
 | 
			
		||||
  }
 | 
			
		||||
})
 | 
			
		||||
 | 
			
		||||
module.exports = {
 | 
			
		||||
  context: path.resolve(__dirname, '../'),
 | 
			
		||||
  entry: {
 | 
			
		||||
    app: './src/main.js'
 | 
			
		||||
  },
 | 
			
		||||
  output: {
 | 
			
		||||
    path: config.build.assetsRoot,
 | 
			
		||||
    filename: '[name].js',
 | 
			
		||||
    publicPath:
 | 
			
		||||
      process.env.NODE_ENV === 'production'
 | 
			
		||||
        ? config.build.assetsPublicPath
 | 
			
		||||
        : config.dev.assetsPublicPath
 | 
			
		||||
  },
 | 
			
		||||
  resolve: {
 | 
			
		||||
    extensions: ['.js', '.vue', '.json'],
 | 
			
		||||
    alias: {
 | 
			
		||||
      '@': resolve('src')
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  module: {
 | 
			
		||||
    rules: [
 | 
			
		||||
      ...(config.dev.useEslint ? [createLintingRule()] : []),
 | 
			
		||||
      {
 | 
			
		||||
        test: /\.vue$/,
 | 
			
		||||
        loader: 'vue-loader',
 | 
			
		||||
        options: vueLoaderConfig
 | 
			
		||||
      },
 | 
			
		||||
      {
 | 
			
		||||
        test: /\.js$/,
 | 
			
		||||
        loader: 'babel-loader',
 | 
			
		||||
        include: [
 | 
			
		||||
          resolve('src'),
 | 
			
		||||
          resolve('test'),
 | 
			
		||||
          resolve('mock'),
 | 
			
		||||
          resolve('node_modules/webpack-dev-server/client')
 | 
			
		||||
        ]
 | 
			
		||||
      },
 | 
			
		||||
      {
 | 
			
		||||
        test: /\.svg$/,
 | 
			
		||||
        loader: 'svg-sprite-loader',
 | 
			
		||||
        include: [resolve('src/icons')],
 | 
			
		||||
        options: {
 | 
			
		||||
          symbolId: 'icon-[name]'
 | 
			
		||||
        }
 | 
			
		||||
      },
 | 
			
		||||
      {
 | 
			
		||||
        test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
 | 
			
		||||
        loader: 'url-loader',
 | 
			
		||||
        exclude: [resolve('src/icons')],
 | 
			
		||||
        options: {
 | 
			
		||||
          limit: 10000,
 | 
			
		||||
          name: utils.assetsPath('img/[name].[hash:7].[ext]')
 | 
			
		||||
        }
 | 
			
		||||
      },
 | 
			
		||||
      {
 | 
			
		||||
        test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
 | 
			
		||||
        loader: 'url-loader',
 | 
			
		||||
        options: {
 | 
			
		||||
          limit: 10000,
 | 
			
		||||
          name: utils.assetsPath('media/[name].[hash:7].[ext]')
 | 
			
		||||
        }
 | 
			
		||||
      },
 | 
			
		||||
      {
 | 
			
		||||
        test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
 | 
			
		||||
        loader: 'url-loader',
 | 
			
		||||
        options: {
 | 
			
		||||
          limit: 10000,
 | 
			
		||||
          name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
 | 
			
		||||
        }
 | 
			
		||||
      }
 | 
			
		||||
    ]
 | 
			
		||||
  },
 | 
			
		||||
  plugins: [new VueLoaderPlugin()],
 | 
			
		||||
  node: {
 | 
			
		||||
    // prevent webpack from injecting useless setImmediate polyfill because Vue
 | 
			
		||||
    // source contains it (although only uses it if it's native).
 | 
			
		||||
    setImmediate: false,
 | 
			
		||||
    // prevent webpack from injecting mocks to Node native modules
 | 
			
		||||
    // that does not make sense for the client
 | 
			
		||||
    dgram: 'empty',
 | 
			
		||||
    fs: 'empty',
 | 
			
		||||
    net: 'empty',
 | 
			
		||||
    tls: 'empty',
 | 
			
		||||
    child_process: 'empty'
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
@@ -1,95 +0,0 @@
 | 
			
		||||
'use strict'
 | 
			
		||||
const path = require('path')
 | 
			
		||||
const utils = require('./utils')
 | 
			
		||||
const webpack = require('webpack')
 | 
			
		||||
const config = require('../config')
 | 
			
		||||
const merge = require('webpack-merge')
 | 
			
		||||
const baseWebpackConfig = require('./webpack.base.conf')
 | 
			
		||||
const HtmlWebpackPlugin = require('html-webpack-plugin')
 | 
			
		||||
const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin')
 | 
			
		||||
const portfinder = require('portfinder')
 | 
			
		||||
 | 
			
		||||
function resolve(dir) {
 | 
			
		||||
  return path.join(__dirname, '..', dir)
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const HOST = process.env.HOST
 | 
			
		||||
const PORT = process.env.PORT && Number(process.env.PORT)
 | 
			
		||||
 | 
			
		||||
const devWebpackConfig = merge(baseWebpackConfig, {
 | 
			
		||||
  mode: 'development',
 | 
			
		||||
  module: {
 | 
			
		||||
    rules: utils.styleLoaders({
 | 
			
		||||
      sourceMap: config.dev.cssSourceMap,
 | 
			
		||||
      usePostCSS: true
 | 
			
		||||
    })
 | 
			
		||||
  },
 | 
			
		||||
  // cheap-module-eval-source-map is faster for development
 | 
			
		||||
  devtool: config.dev.devtool,
 | 
			
		||||
 | 
			
		||||
  // these devServer options should be customized in /config/index.js
 | 
			
		||||
  devServer: {
 | 
			
		||||
    clientLogLevel: 'warning',
 | 
			
		||||
    historyApiFallback: true,
 | 
			
		||||
    hot: true,
 | 
			
		||||
    compress: true,
 | 
			
		||||
    host: HOST || config.dev.host,
 | 
			
		||||
    port: PORT || config.dev.port,
 | 
			
		||||
    open: config.dev.autoOpenBrowser,
 | 
			
		||||
    overlay: config.dev.errorOverlay
 | 
			
		||||
      ? { warnings: false, errors: true }
 | 
			
		||||
      : false,
 | 
			
		||||
    publicPath: config.dev.assetsPublicPath,
 | 
			
		||||
    proxy: config.dev.proxyTable,
 | 
			
		||||
    quiet: true, // necessary for FriendlyErrorsPlugin
 | 
			
		||||
    watchOptions: {
 | 
			
		||||
      poll: config.dev.poll
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  plugins: [
 | 
			
		||||
    new webpack.DefinePlugin({
 | 
			
		||||
      'process.env': require('../config/dev.env')
 | 
			
		||||
    }),
 | 
			
		||||
    new webpack.HotModuleReplacementPlugin(),
 | 
			
		||||
    // https://github.com/ampedandwired/html-webpack-plugin
 | 
			
		||||
    new HtmlWebpackPlugin({
 | 
			
		||||
      filename: 'index.html',
 | 
			
		||||
      template: 'index.html',
 | 
			
		||||
      inject: true,
 | 
			
		||||
      favicon: resolve('favicon.ico'),
 | 
			
		||||
      title: 'vue-admin-template'
 | 
			
		||||
    })
 | 
			
		||||
  ]
 | 
			
		||||
})
 | 
			
		||||
 | 
			
		||||
module.exports = new Promise((resolve, reject) => {
 | 
			
		||||
  portfinder.basePort = process.env.PORT || config.dev.port
 | 
			
		||||
  portfinder.getPort((err, port) => {
 | 
			
		||||
    if (err) {
 | 
			
		||||
      reject(err)
 | 
			
		||||
    } else {
 | 
			
		||||
      // publish the new Port, necessary for e2e tests
 | 
			
		||||
      process.env.PORT = port
 | 
			
		||||
      // add port to devServer config
 | 
			
		||||
      devWebpackConfig.devServer.port = port
 | 
			
		||||
 | 
			
		||||
      // Add FriendlyErrorsPlugin
 | 
			
		||||
      devWebpackConfig.plugins.push(
 | 
			
		||||
        new FriendlyErrorsPlugin({
 | 
			
		||||
          compilationSuccessInfo: {
 | 
			
		||||
            messages: [
 | 
			
		||||
              `Your application is running here: http://${
 | 
			
		||||
                devWebpackConfig.devServer.host
 | 
			
		||||
              }:${port}`
 | 
			
		||||
            ]
 | 
			
		||||
          },
 | 
			
		||||
          onErrors: config.dev.notifyOnErrors
 | 
			
		||||
            ? utils.createNotifierCallback()
 | 
			
		||||
            : undefined
 | 
			
		||||
        })
 | 
			
		||||
      )
 | 
			
		||||
 | 
			
		||||
      resolve(devWebpackConfig)
 | 
			
		||||
    }
 | 
			
		||||
  })
 | 
			
		||||
})
 | 
			
		||||
@@ -1,177 +0,0 @@
 | 
			
		||||
'use strict'
 | 
			
		||||
const path = require('path')
 | 
			
		||||
const utils = require('./utils')
 | 
			
		||||
const webpack = require('webpack')
 | 
			
		||||
const config = require('../config')
 | 
			
		||||
const merge = require('webpack-merge')
 | 
			
		||||
const baseWebpackConfig = require('./webpack.base.conf')
 | 
			
		||||
const CopyWebpackPlugin = require('copy-webpack-plugin')
 | 
			
		||||
const HtmlWebpackPlugin = require('html-webpack-plugin')
 | 
			
		||||
const ScriptExtHtmlWebpackPlugin = require('script-ext-html-webpack-plugin')
 | 
			
		||||
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
 | 
			
		||||
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin')
 | 
			
		||||
const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
 | 
			
		||||
 | 
			
		||||
function resolve(dir) {
 | 
			
		||||
  return path.join(__dirname, '..', dir)
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const env = require('../config/prod.env')
 | 
			
		||||
 | 
			
		||||
// For NamedChunksPlugin
 | 
			
		||||
const seen = new Set()
 | 
			
		||||
const nameLength = 4
 | 
			
		||||
 | 
			
		||||
const webpackConfig = merge(baseWebpackConfig, {
 | 
			
		||||
  mode: 'production',
 | 
			
		||||
  module: {
 | 
			
		||||
    rules: utils.styleLoaders({
 | 
			
		||||
      sourceMap: config.build.productionSourceMap,
 | 
			
		||||
      extract: true,
 | 
			
		||||
      usePostCSS: true
 | 
			
		||||
    })
 | 
			
		||||
  },
 | 
			
		||||
  devtool: config.build.productionSourceMap ? config.build.devtool : false,
 | 
			
		||||
  output: {
 | 
			
		||||
    path: config.build.assetsRoot,
 | 
			
		||||
    filename: utils.assetsPath('js/[name].[chunkhash:8].js'),
 | 
			
		||||
    chunkFilename: utils.assetsPath('js/[name].[chunkhash:8].js')
 | 
			
		||||
  },
 | 
			
		||||
  plugins: [
 | 
			
		||||
    // http://vuejs.github.io/vue-loader/en/workflow/production.html
 | 
			
		||||
    new webpack.DefinePlugin({
 | 
			
		||||
      'process.env': env
 | 
			
		||||
    }),
 | 
			
		||||
    // extract css into its own file
 | 
			
		||||
    new MiniCssExtractPlugin({
 | 
			
		||||
      filename: utils.assetsPath('css/[name].[contenthash:8].css'),
 | 
			
		||||
      chunkFilename: utils.assetsPath('css/[name].[contenthash:8].css')
 | 
			
		||||
    }),
 | 
			
		||||
    // generate dist index.html with correct asset hash for caching.
 | 
			
		||||
    // you can customize output by editing /index.html
 | 
			
		||||
    // see https://github.com/ampedandwired/html-webpack-plugin
 | 
			
		||||
    new HtmlWebpackPlugin({
 | 
			
		||||
      filename: config.build.index,
 | 
			
		||||
      template: 'index.html',
 | 
			
		||||
      inject: true,
 | 
			
		||||
      favicon: resolve('favicon.ico'),
 | 
			
		||||
      title: 'vue-admin-template',
 | 
			
		||||
      minify: {
 | 
			
		||||
        removeComments: true,
 | 
			
		||||
        collapseWhitespace: true,
 | 
			
		||||
        removeAttributeQuotes: true
 | 
			
		||||
        // more options:
 | 
			
		||||
        // https://github.com/kangax/html-minifier#options-quick-reference
 | 
			
		||||
      }
 | 
			
		||||
      // default sort mode uses toposort which cannot handle cyclic deps
 | 
			
		||||
      // in certain cases, and in webpack 4, chunk order in HTML doesn't
 | 
			
		||||
      // matter anyway
 | 
			
		||||
    }),
 | 
			
		||||
    new ScriptExtHtmlWebpackPlugin({
 | 
			
		||||
      //`runtime` must same as runtimeChunk name. default is `runtime`
 | 
			
		||||
      inline: /runtime\..*\.js$/
 | 
			
		||||
    }),
 | 
			
		||||
    // keep chunk.id stable when chunk has no name
 | 
			
		||||
    new webpack.NamedChunksPlugin(chunk => {
 | 
			
		||||
      if (chunk.name) {
 | 
			
		||||
        return chunk.name
 | 
			
		||||
      }
 | 
			
		||||
      const modules = Array.from(chunk.modulesIterable)
 | 
			
		||||
      if (modules.length > 1) {
 | 
			
		||||
        const hash = require('hash-sum')
 | 
			
		||||
        const joinedHash = hash(modules.map(m => m.id).join('_'))
 | 
			
		||||
        let len = nameLength
 | 
			
		||||
        while (seen.has(joinedHash.substr(0, len))) len++
 | 
			
		||||
        seen.add(joinedHash.substr(0, len))
 | 
			
		||||
        return `chunk-${joinedHash.substr(0, len)}`
 | 
			
		||||
      } else {
 | 
			
		||||
        return modules[0].id
 | 
			
		||||
      }
 | 
			
		||||
    }),
 | 
			
		||||
    // keep module.id stable when vender modules does not change
 | 
			
		||||
    new webpack.HashedModuleIdsPlugin(),
 | 
			
		||||
    // copy custom static assets
 | 
			
		||||
    new CopyWebpackPlugin([
 | 
			
		||||
      {
 | 
			
		||||
        from: path.resolve(__dirname, '../static'),
 | 
			
		||||
        to: config.build.assetsSubDirectory,
 | 
			
		||||
        ignore: ['.*']
 | 
			
		||||
      }
 | 
			
		||||
    ])
 | 
			
		||||
  ],
 | 
			
		||||
  optimization: {
 | 
			
		||||
    splitChunks: {
 | 
			
		||||
      chunks: 'all',
 | 
			
		||||
      cacheGroups: {
 | 
			
		||||
        libs: {
 | 
			
		||||
          name: 'chunk-libs',
 | 
			
		||||
          test: /[\\/]node_modules[\\/]/,
 | 
			
		||||
          priority: 10,
 | 
			
		||||
          chunks: 'initial' // 只打包初始时依赖的第三方
 | 
			
		||||
        },
 | 
			
		||||
        elementUI: {
 | 
			
		||||
          name: 'chunk-elementUI', // 单独将 elementUI 拆包
 | 
			
		||||
          priority: 20, // 权重要大于 libs 和 app 不然会被打包进 libs 或者 app
 | 
			
		||||
          test: /[\\/]node_modules[\\/]element-ui[\\/]/
 | 
			
		||||
        }
 | 
			
		||||
      }
 | 
			
		||||
    },
 | 
			
		||||
    runtimeChunk: 'single',
 | 
			
		||||
    minimizer: [
 | 
			
		||||
      new UglifyJsPlugin({
 | 
			
		||||
        uglifyOptions: {
 | 
			
		||||
          mangle: {
 | 
			
		||||
            safari10: true
 | 
			
		||||
          }
 | 
			
		||||
        },
 | 
			
		||||
        sourceMap: config.build.productionSourceMap,
 | 
			
		||||
        cache: true,
 | 
			
		||||
        parallel: true
 | 
			
		||||
      }),
 | 
			
		||||
      // Compress extracted CSS. We are using this plugin so that possible
 | 
			
		||||
      // duplicated CSS from different components can be deduped.
 | 
			
		||||
      new OptimizeCSSAssetsPlugin()
 | 
			
		||||
    ]
 | 
			
		||||
  }
 | 
			
		||||
})
 | 
			
		||||
 | 
			
		||||
if (config.build.productionGzip) {
 | 
			
		||||
  const CompressionWebpackPlugin = require('compression-webpack-plugin')
 | 
			
		||||
 | 
			
		||||
  webpackConfig.plugins.push(
 | 
			
		||||
    new CompressionWebpackPlugin({
 | 
			
		||||
      algorithm: 'gzip',
 | 
			
		||||
      test: new RegExp(
 | 
			
		||||
        '\\.(' + config.build.productionGzipExtensions.join('|') + ')$'
 | 
			
		||||
      ),
 | 
			
		||||
      threshold: 10240,
 | 
			
		||||
      minRatio: 0.8
 | 
			
		||||
    })
 | 
			
		||||
  )
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
if (config.build.generateAnalyzerReport || config.build.bundleAnalyzerReport) {
 | 
			
		||||
  const BundleAnalyzerPlugin = require('webpack-bundle-analyzer')
 | 
			
		||||
    .BundleAnalyzerPlugin
 | 
			
		||||
 | 
			
		||||
  if (config.build.bundleAnalyzerReport) {
 | 
			
		||||
    webpackConfig.plugins.push(
 | 
			
		||||
      new BundleAnalyzerPlugin({
 | 
			
		||||
        analyzerPort: 8080,
 | 
			
		||||
        generateStatsFile: false
 | 
			
		||||
      })
 | 
			
		||||
    )
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  if (config.build.generateAnalyzerReport) {
 | 
			
		||||
    webpackConfig.plugins.push(
 | 
			
		||||
      new BundleAnalyzerPlugin({
 | 
			
		||||
        analyzerMode: 'static',
 | 
			
		||||
        reportFilename: 'bundle-report.html',
 | 
			
		||||
        openAnalyzer: false
 | 
			
		||||
      })
 | 
			
		||||
    )
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
module.exports = webpackConfig
 | 
			
		||||
		Reference in New Issue
	
	Block a user