diff --git a/build/build.js b/build/build.js index 955e9de..8c6cebd 100644 --- a/build/build.js +++ b/build/build.js @@ -19,13 +19,15 @@ rm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), 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') + 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')) @@ -33,9 +35,11 @@ rm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), err => { } 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' - )) + 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" + ) + ) }) }) diff --git a/build/check-versions.js b/build/check-versions.js index 3ef972a..c5c29e9 100644 --- a/build/check-versions.js +++ b/build/check-versions.js @@ -4,8 +4,11 @@ const semver = require('semver') const packageConfig = require('../package.json') const shell = require('shelljs') -function exec (cmd) { - return require('child_process').execSync(cmd).toString().trim() +function exec(cmd) { + return require('child_process') + .execSync(cmd) + .toString() + .trim() } const versionRequirements = [ @@ -24,23 +27,30 @@ if (shell.which('npm')) { }) } -module.exports = function () { +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) + 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( + chalk.yellow( + 'To use this template, you must update following to modules:' + ) + ) console.log() for (let i = 0; i < warnings.length; i++) { diff --git a/build/utils.js b/build/utils.js index 8e6c9cc..c96d093 100644 --- a/build/utils.js +++ b/build/utils.js @@ -4,15 +4,16 @@ 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 +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) { +exports.cssLoaders = function(options) { options = options || {} const cssLoader = { @@ -73,7 +74,7 @@ exports.cssLoaders = function (options) { } // Generate loaders for standalone style files (outside of .vue) -exports.styleLoaders = function (options) { +exports.styleLoaders = function(options) { const output = [] const loaders = exports.cssLoaders(options) diff --git a/build/webpack.base.conf.js b/build/webpack.base.conf.js index 06c3278..4be51b1 100644 --- a/build/webpack.base.conf.js +++ b/build/webpack.base.conf.js @@ -5,7 +5,7 @@ const config = require('../config') const { VueLoaderPlugin } = require('vue-loader') const vueLoaderConfig = require('./vue-loader.conf') -function resolve (dir) { +function resolve(dir) { return path.join(__dirname, '..', dir) } @@ -28,9 +28,10 @@ module.exports = { output: { path: config.build.assetsRoot, filename: '[name].js', - publicPath: process.env.NODE_ENV === 'production' - ? config.build.assetsPublicPath - : config.dev.assetsPublicPath + publicPath: + process.env.NODE_ENV === 'production' + ? config.build.assetsPublicPath + : config.dev.assetsPublicPath }, resolve: { extensions: ['.js', '.vue', '.json'], @@ -49,7 +50,11 @@ module.exports = { { test: /\.js$/, loader: 'babel-loader', - include: [resolve('src'), resolve('test') ,resolve('node_modules/webpack-dev-server/client')] + include: [ + resolve('src'), + resolve('test'), + resolve('node_modules/webpack-dev-server/client') + ] }, { test: /\.svg$/, @@ -86,9 +91,7 @@ module.exports = { } ] }, - plugins: [ - new VueLoaderPlugin(), - ], + plugins: [new VueLoaderPlugin()], node: { // prevent webpack from injecting useless setImmediate polyfill because Vue // source contains it (although only uses it if it's native). diff --git a/build/webpack.dev.conf.js b/build/webpack.dev.conf.js index 0420662..ec93025 100644 --- a/build/webpack.dev.conf.js +++ b/build/webpack.dev.conf.js @@ -9,7 +9,7 @@ const HtmlWebpackPlugin = require('html-webpack-plugin') const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin') const portfinder = require('portfinder') -function resolve (dir) { +function resolve(dir) { return path.join(__dirname, '..', dir) } @@ -19,7 +19,10 @@ 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 }) + rules: utils.styleLoaders({ + sourceMap: config.dev.cssSourceMap, + usePostCSS: true + }) }, // cheap-module-eval-source-map is faster for development devtool: config.dev.devtool, @@ -40,7 +43,7 @@ const devWebpackConfig = merge(baseWebpackConfig, { proxy: config.dev.proxyTable, quiet: true, // necessary for FriendlyErrorsPlugin watchOptions: { - poll: config.dev.poll, + poll: config.dev.poll } }, plugins: [ @@ -55,7 +58,7 @@ const devWebpackConfig = merge(baseWebpackConfig, { inject: true, favicon: resolve('favicon.ico'), title: 'vue-element-admin' - }), + }) ] }) @@ -71,14 +74,20 @@ module.exports = new Promise((resolve, reject) => { 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 - })) + 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) } diff --git a/build/webpack.prod.conf.js b/build/webpack.prod.conf.js index 00d916e..1f5acef 100644 --- a/build/webpack.prod.conf.js +++ b/build/webpack.prod.conf.js @@ -19,8 +19,8 @@ function resolve(dir) { const env = require('../config/prod.env') // For NamedChunksPlugin -const seen = new Set(); -const nameLength = 4; +const seen = new Set() +const nameLength = 4 const webpackConfig = merge(baseWebpackConfig, { mode: 'production', @@ -62,7 +62,7 @@ const webpackConfig = merge(baseWebpackConfig, { 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 @@ -74,28 +74,30 @@ const webpackConfig = merge(baseWebpackConfig, { // keep chunk.id stable when chunk has no name new webpack.NamedChunksPlugin(chunk => { if (chunk.name) { - return chunk.name; + return chunk.name } - const modules = Array.from(chunk.modulesIterable); + 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)}`; + 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; + 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: ['.*'] - }]) + new CopyWebpackPlugin([ + { + from: path.resolve(__dirname, '../static'), + to: config.build.assetsSubDirectory, + ignore: ['.*'] + } + ]) ], optimization: { splitChunks: { @@ -129,7 +131,7 @@ const webpackConfig = merge(baseWebpackConfig, { // Compress extracted CSS. We are using this plugin so that possible // duplicated CSS from different components can be deduped. new OptimizeCSSAssetsPlugin() - ], + ] } }) @@ -141,9 +143,7 @@ if (config.build.productionGzip) { asset: '[path].gz[query]', algorithm: 'gzip', test: new RegExp( - '\\.(' + - config.build.productionGzipExtensions.join('|') + - ')$' + '\\.(' + config.build.productionGzipExtensions.join('|') + ')$' ), threshold: 10240, minRatio: 0.8 @@ -152,21 +152,26 @@ if (config.build.productionGzip) { } if (config.build.generateAnalyzerReport || config.build.bundleAnalyzerReport) { - const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin + const BundleAnalyzerPlugin = require('webpack-bundle-analyzer') + .BundleAnalyzerPlugin if (config.build.bundleAnalyzerReport) { - webpackConfig.plugins.push(new BundleAnalyzerPlugin({ - analyzerPort: 8080, - generateStatsFile: false - })) + 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 - })) + webpackConfig.plugins.push( + new BundleAnalyzerPlugin({ + analyzerMode: 'static', + reportFilename: 'bundle-report.html', + openAnalyzer: false + }) + ) } }