diff --git a/nezha-fronted/README.md b/nezha-fronted/README.md index 9faddcd74..0f5e6f863 100644 --- a/nezha-fronted/README.md +++ b/nezha-fronted/README.md @@ -32,5 +32,7 @@ specs 配置对应的测试用例 （https://docs.geedge.net/pages/viewpage.acti #思维导图 https://docs.geedge.net/pages/viewpage.action?pageId=67209306 - +#配置多入口 +dev 正常启动 +dev:html 导出为html diff --git a/nezha-fronted/build/build.js b/nezha-fronted/build/build.js index 4356166e3..a4cba8649 100644 --- a/nezha-fronted/build/build.js +++ b/nezha-fronted/build/build.js @@ -1,10 +1,8 @@ 'use strict' require('./check-versions')() - const arg = process.argv.splice(2)[0] process.env.NODE_ENV = 'production' process.env.BUILD_MODE = arg -process.env.ONLY_HTML = arg == 'html' const ora = require('ora') const rm = require('rimraf') @@ -13,7 +11,6 @@ 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() diff --git a/nezha-fronted/build/webpack.base.conf.js b/nezha-fronted/build/webpack.base.conf.js index e9eb43ff9..05a72f998 100644 --- a/nezha-fronted/build/webpack.base.conf.js +++ b/nezha-fronted/build/webpack.base.conf.js @@ -3,39 +3,16 @@ const path = require('path') const utils = require('./utils') const config = require('../config') const vueLoaderConfig = require('./vue-loader.conf') -console.log(process.env.ONLY_HTML) +const arg = process.env.BUILD_MODE +const devStart = process.env.npm_lifecycle_event function resolve (dir) { return path.join(__dirname, '..', dir) } -const onlyHtml = { - // publicPath: '', // 使用相对路径 - // indexPath: 'index.html', - // outputDir: 'dist', - // // assetsDir: 'static', - // productionSourceMap: false, - // chainWebpack: config => { - // config.plugin('preload').tap(args => { - // args[0].fileBlacklist.push(/\.css/, /\.js/) - // return args - // }) - // config.plugin('inline-source') - // .use(require('html-webpack-inline-source-plugin')) - // config.plugin('html').tap(args => { - // args[0].chunksSortMode = 'none' - // args[0].inlineSource = '(\.css|\.js$)' - // return args - // }) - // config.resolve.alias // 添加别名 - // .set('@', resolve('src')) - // .set('@assets', resolve('src/assets')) - // .set('@components', resolve('src/components')) - // } -} -module.exports = { +const baseConfig = { context: path.resolve(__dirname, '../'), entry: { - app: './src/app/main.js', - entrance: './src/entrance/entrance.main.js' + app: './src/entrance/app/main.js', + exportHtml: './src/entrance/exportHtml/exportHtml.js' }, output: { path: config.build.assetsRoot, @@ -120,6 +97,50 @@ module.exports = { net: 'empty', tls: 'empty', child_process: 'empty' - }, - ...onlyHtml + } } +if (arg === 'html' || devStart === 'dev:html') { + delete baseConfig.entry.app + baseConfig.module.rules.unshift({ + include: [ + resolve('src/entrance/app'), + resolve('src/components/common/alert'), + resolve('src/components/common/bottomBox'), + resolve('src/components/common/detailView'), + resolve('src/components/common/elSelect'), + resolve('src/components/common/filterSearch'), + resolve('src/components/common/globalSearch'), + resolve('src/components/common/honeycomb'), + resolve('src/components/common/myDatePicker'), + resolve('src/components/common/overView'), + resolve('src/components/common/popBox'), + resolve('src/components/common/project'), + resolve('src/components/common/rightBox'), + resolve('src/components/common/table'), + resolve('src/components/common/v-selectpagenew'), + resolve('src/components/page') + ], + loader: 'url-loader', + options: { + limit: 10, + generator: (content, mimetype, encoding, resourcePath) => { + return '' + } + } + }) +} else if (arg === 'app' || devStart === 'dev') { + delete baseConfig.entry.exportHtml + baseConfig.module.rules.unshift({ + include: [ + resolve('src/entrance/exportHtml') + ], + loader: 'url-loader', + options: { + limit: 10, + generator: (content, mimetype, encoding, resourcePath) => { + return '' + } + } + }) +} +module.exports = { ...baseConfig } diff --git a/nezha-fronted/build/webpack.dev.conf.js b/nezha-fronted/build/webpack.dev.conf.js index 50aed5303..d182f51f0 100644 --- a/nezha-fronted/build/webpack.dev.conf.js +++ b/nezha-fronted/build/webpack.dev.conf.js @@ -12,8 +12,10 @@ const portfinder = require('portfinder') const HOST = process.env.HOST const PORT = process.env.PORT && Number(process.env.PORT) - -const devWebpackConfig = merge(baseWebpackConfig, { +const devStart = process.env.npm_lifecycle_event +const indexHtml = devStart === 'dev' ? 'src/entrance/app/index.html' : 'src/entrance/exportHtml/exportHtml.html' +let devWebpackConfig = '' +devWebpackConfig = merge(baseWebpackConfig, { module: { rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, usePostCSS: true }) }, @@ -25,7 +27,7 @@ const devWebpackConfig = merge(baseWebpackConfig, { clientLogLevel: 'warning', historyApiFallback: { rewrites: [ - { from: /.*/, to: path.posix.join(config.dev.assetsPublicPath, 'src/app/index.html') } + { from: /.*/, to: path.posix.join(config.dev.assetsPublicPath, indexHtml) } ] }, hot: true, @@ -57,9 +59,9 @@ const devWebpackConfig = merge(baseWebpackConfig, { new HtmlWebpackPlugin({ favicon: path.resolve(__dirname, '../src/assets/img/favicon.ico'), filename: 'index.html', - template: 'src/app/index.html', + template: indexHtml, inject: true, - chunks: ['app'] + chunks: devStart === 'dev' ? ['app'] : ['exportHtml'] }), // copy custom static assets new CopyWebpackPlugin([ diff --git a/nezha-fronted/build/webpack.dev.only-html.conf.js b/nezha-fronted/build/webpack.dev.only-html.conf.js deleted file mode 100644 index 1b8cb0f13..000000000 --- a/nezha-fronted/build/webpack.dev.only-html.conf.js +++ /dev/null @@ -1,105 +0,0 @@ -'use strict' -process.env.ONLY_HTML = true -const utils = require('./utils') -const webpack = require('webpack') -const config = require('../config') -const merge = require('webpack-merge') -const path = require('path') -const baseWebpackConfig = require('./webpack.base.conf') -const CopyWebpackPlugin = require('copy-webpack-plugin') -const HtmlWebpackPlugin = require('html-webpack-plugin') -const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin') -const portfinder = require('portfinder') - -const HOST = process.env.HOST -const PORT = process.env.PORT && Number(process.env.PORT) - -const devWebpackConfig = merge(baseWebpackConfig, { - 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: { - rewrites: [ - { from: /.*/, to: path.posix.join(config.dev.assetsPublicPath, 'src/entrance/entrance.html') } - ] - }, - hot: true, - inline:true, - contentBase: false, // since we use CopyWebpackPlugin. - 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: '/', - /* 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(), - new webpack.NamedModulesPlugin(), // HMR shows correct file names in console on update. - new webpack.NoEmitOnErrorsPlugin(), - // https://github.com/ampedandwired/html-webpack-plugin - new HtmlWebpackPlugin({ - favicon: path.resolve(__dirname, '../src/assets/img/favicon.ico'), - filename: 'entrance.html', - template: 'src/entrance/entrance.html', - inject: true, - chunks: ['entrance'] - }), - // copy custom static assets - new CopyWebpackPlugin([ - { - from: path.resolve(__dirname, '../static'), - to: config.dev.assetsSubDirectory, - ignore: ['.*'] - }, - { - from: path.resolve(__dirname, '../src/components/chart'), - to: 'components/chart', - ignore: ['.*'] - } - ]) - ] -}) - -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) - } - }) -}) diff --git a/nezha-fronted/build/webpack.prod-html.conf.js b/nezha-fronted/build/webpack.prod-html.conf.js deleted file mode 100644 index ed089f615..000000000 --- a/nezha-fronted/build/webpack.prod-html.conf.js +++ /dev/null @@ -1,281 +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') -console.log(process.env.ONLY_HTML,baseWebpackConfig) -const CopyWebpackPlugin = require('copy-webpack-plugin') -const HtmlWebpackPlugin = require('html-webpack-plugin') -const ExtractTextPlugin = require('extract-text-webpack-plugin') -const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin') -const ParallelUglifyPlugin = require('webpack-parallel-uglify-plugin') -const fileManagerPlugin = require('filemanager-webpack-plugin') -const WebpackZipPlugin = require('webpack-zip-plugin') -// const GitRevisionPlugin = require('git-revision-webpack-plugin') -const GenerateAssetPlugin = require('generate-asset-webpack-plugin') -const WebpackShellPlugin = require('webpack-shell-plugin') -const serverConfig = require('../static/config.json')// 引入根目录下的配置文件 -const HtmlWebpackInlineSourcePlugin = require('html-webpack-inline-source-plugin') - -// const gitRevisionPlugin = new GitRevisionPlugin(); -const createJson = function () { - // serverConfig.version=config.build.version +"-"+gitRevisionPlugin.commithash(); - serverConfig.version = config.build.version - return JSON.stringify(serverConfig) -} - -const env = require('../config/prod.env') -/* const GenerateAssetPlugin = require('generate-asset-webpack-plugin'); -const createConfig = function(compilation){ - let cfgJson={baseUrl:"http://192.168.40.247:8080/nz-admin"}; - return JSON.stringify(cfgJson); -} */ -let webpackConfig = {} -webpackConfig = merge(baseWebpackConfig, { - 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].js'), - chunkFilename: utils.assetsPath('js/[name].[chunkhash].js') - }, - plugins: [ - /* new GenerateAssetPlugin({ - filename: 'config.json', - fn: (compilation, cb) => { - cb(null, createConfig(compilation)); - }, - extraFiles: [] - }), */ - // http://vuejs.github.io/vue-loader/en/workflow/production.html - new webpack.DefinePlugin({ - 'process.env': env - }), - new ParallelUglifyPlugin({ - cacheDir: '.cache/', - uglifyJS: { - output: { - comments: false - }, - warnings: false, - compress: { - drop_debugger: true, - drop_console: true - } - } - }), - // extract css into its own file - new ExtractTextPlugin({ - filename: utils.assetsPath('css/[name].[contenthash].css'), - // Setting the following option to `false` will not extract CSS from codesplit chunks. - // Their CSS will instead be inserted dynamically with style-loader when the codesplit chunk has been loaded by webpack. - // It's currently set to `true` because we are seeing that sourcemaps are included in the codesplit bundle as well when it's `false`, - // increasing file size: https://github.com/vuejs-templates/webpack/issues/1110 - allChunks: true - }), - // Compress extracted CSS. We are using this plugin so that possible - // duplicated CSS from different components can be deduped. - new OptimizeCSSPlugin({ - cssProcessorOptions: config.build.productionSourceMap - ? { safe: true, map: { inline: false } } - : { safe: true } - }), - // 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({ - favicon: path.resolve(__dirname, '../src/assets/img/favicon.ico'), - filename: config.build.index, - template: 'src/entrance/entrance.html', - inlineSource: '.(js|css)$', // embed all javascript and css inline - hash: false, - inject: true, - minify: { - removeComments: true, - collapseWhitespace: true, - removeAttributeQuotes: true - // more options: - // https://github.com/kangax/html-minifier#options-quick-reference - }, - // necessary to consistently work with multiple chunks via CommonsChunkPlugin - chunksSortMode: 'dependency', - chunks: ['entrance'] - }), - new HtmlWebpackInlineSourcePlugin(), - new GenerateAssetPlugin({ - filename: 'static/config.json', - fn: (compilation, cb) => { - cb(null, createJson()) - } - }), - // keep module.id stable when vendor modules does not change - new webpack.HashedModuleIdsPlugin(), - // enable scope hoisting - new webpack.optimize.ModuleConcatenationPlugin(), - // split vendor js into its own file - new webpack.optimize.CommonsChunkPlugin({ - name: 'vendor', - minChunks (module) { - // any required modules inside node_modules are extracted to vendor - return ( - module.resource && - /\.js$/.test(module.resource) && - module.resource.indexOf( - path.join(__dirname, '../node_modules') - ) === 0 - ) - } - }), - // extract webpack runtime and module manifest to its own file in order to - // prevent vendor hash from being updated whenever app bundle is updated - new webpack.optimize.CommonsChunkPlugin({ - name: 'manifest', - minChunks: Infinity - }), - // This instance extracts shared chunks from code splitted chunks and bundles them - // in a separate chunk, similar to the vendor chunk - // see: https://webpack.js.org/plugins/commons-chunk-plugin/#extra-async-commons-chunk - new webpack.optimize.CommonsChunkPlugin({ - name: 'entrance', - async: 'vendor-async', - children: true, - minChunks: 3 - }), - - // copy custom static assets - new CopyWebpackPlugin([ - { - from: path.resolve(__dirname, '../static'), - to: config.build.assetsSubDirectory, - ignore: ['*'] - }, - { - from: path.resolve(__dirname, '../src/components/chart'), - to: 'components', - ignore: ['.*'] - } - ]) - ] -}) - -if (process.env.NODE_ENV == 'development') { - webpackConfig.plugins.push( - new fileManagerPlugin({ - onStart: [ - { - delete: [path.join(__dirname, '../dist/')] - } - ], - onEnd: [ - { - move: [ - { source: path.join(__dirname, '../dist', '/static/config.json'), destination: path.join(__dirname, '../dist/config.json') } - - ], - mkdir: [ - path.join(__dirname, '../dist', '/static') - ], - copy: [ - { source: path.join(__dirname, '../dist', '/config.json'), destination: path.join(__dirname, '../dist', '/static/config.json') } - ] - }, - { - delete: [ - path.join(__dirname, '../dist', '/config.json') - ] - }, - { - archive: [ - { source: path.join(__dirname, '../dist'), destination: path.join(__dirname, '../dist', '/nz-gui.zip') } - ] - } - ] - }) - ) -} else { - webpackConfig.plugins.push( - new fileManagerPlugin({ - onStart: [ - { - delete: [path.join(__dirname, '../dist/')] - } - ], - onEnd: [ - { - move: [ - { source: path.join(__dirname, '../dist', '/static/config.json'), destination: path.join(__dirname, '../dist/config.json') } - - ], - mkdir: [ - path.join(__dirname, '../dist', '/static') - ], - copy: [ - { source: path.join(__dirname, '../dist', '/config.json'), destination: path.join(__dirname, '../dist', '/static/config.json') } - ] - }, - { - delete: [ - path.join(__dirname, '../dist', '/config.json'), - path.join(__dirname, '../.cache/') - ] - }, - { - archive: [ - { source: path.join(__dirname, '../dist'), destination: path.join(__dirname, '../dist', '/nz-gui.zip') } - ] - } - ] - }) - // new WebpackZipPlugin({ - // initialFile: './dist', - // endPath: './dist', - // zipName: 'nz-gui.zip' - // // behindShell: 'cd ' + path.join(__dirname, '../dist/') + ";md5=`md5sum nz-gui.zip |awk '{print $1}'|cut -c 1-8`;mv nz-gui.zip nz-gui-${md5}.zip;" + (process.env.BUILD_MODE == 'all' ? 'mkdir -p ./dist/static;echo "start add map picture to zip file,it will take a few moment,please wait...";cp -r ../static/Tiles dist/static/;zip -gr nz-gui-${md5}.zip dist/static/Tiles>/dev/null;rm -rf dist;' : '') - // }) - // new WebpackShellPlugin({ - // onBuildStart: ['/bin/bash ' + path.join(__dirname, 'script') + '/buildStart.sh'], - // onBuildEnd: ['/bin/bash ' + path.join(__dirname, 'script') + '/buildEnd.sh ' + process.env.BUILD_MODE] - // }) - // new fileManagerPlugin({ - // onStart: [ - // { - // delete: [path.join(__dirname, '../dist/')] - // } - // ] - // }) - ) -} - -if (config.build.productionGzip) { - const CompressionWebpackPlugin = require('compression-webpack-plugin') - - webpackConfig.plugins.push( - new CompressionWebpackPlugin({ - asset: '[path].gz[query]', - algorithm: 'gzip', - test: new RegExp( - '\\.(' + - config.build.productionGzipExtensions.join('|') + - ')$' - ), - threshold: 10240, - minRatio: 0.8 - }) - ) -} - -if (config.build.bundleAnalyzerReport) { - const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin - webpackConfig.plugins.push(new BundleAnalyzerPlugin()) -} - -module.exports = webpackConfig diff --git a/nezha-fronted/build/webpack.prod.conf.js b/nezha-fronted/build/webpack.prod.conf.js index dbeae7d18..5cc499295 100644 --- a/nezha-fronted/build/webpack.prod.conf.js +++ b/nezha-fronted/build/webpack.prod.conf.js @@ -1,24 +1,23 @@ 'use strict' const path = require('path') - +const arg = process.env.BUILD_MODE const utils = require('./utils') const webpack = require('webpack') const config = require('../config') const merge = require('webpack-merge') const baseWebpackConfig = require('./webpack.base.conf') -console.log(process.env.ONLY_HTML,baseWebpackConfig) const CopyWebpackPlugin = require('copy-webpack-plugin') const HtmlWebpackPlugin = require('html-webpack-plugin') const ExtractTextPlugin = require('extract-text-webpack-plugin') const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin') -const ParallelUglifyPlugin = require('webpack-parallel-uglify-plugin') +// const ParallelUglifyPlugin = require('webpack-parallel-uglify-plugin') const fileManagerPlugin = require('filemanager-webpack-plugin') const WebpackZipPlugin = require('webpack-zip-plugin') // const GitRevisionPlugin = require('git-revision-webpack-plugin') const GenerateAssetPlugin = require('generate-asset-webpack-plugin') const WebpackShellPlugin = require('webpack-shell-plugin') -const serverConfig = require('../static/config.json')// 引入根目录下的配置文件 const HtmlWebpackInlineSourcePlugin = require('html-webpack-inline-source-plugin') +const serverConfig = require('../static/config.json')// 引入根目录下的配置文件 // const gitRevisionPlugin = new GitRevisionPlugin(); const createJson = function () { @@ -34,137 +33,262 @@ const createConfig = function(compilation){ return JSON.stringify(cfgJson); } */ let webpackConfig = {} -webpackConfig = merge(baseWebpackConfig, { - 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].js'), - chunkFilename: utils.assetsPath('js/[name].[chunkhash].js') - }, - plugins: [ - /* new GenerateAssetPlugin({ - filename: 'config.json', - fn: (compilation, cb) => { - cb(null, createConfig(compilation)); - }, - extraFiles: [] - }), */ - // http://vuejs.github.io/vue-loader/en/workflow/production.html - new webpack.DefinePlugin({ - 'process.env': env - }), - new ParallelUglifyPlugin({ - cacheDir: '.cache/', - uglifyJS: { - output: { - comments: false +if (arg === 'html') { + webpackConfig = merge(baseWebpackConfig, { + 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].js'), + chunkFilename: utils.assetsPath('js/[name].[chunkhash].js') + }, + plugins: [ + /* new GenerateAssetPlugin({ + filename: 'config.json', + fn: (compilation, cb) => { + cb(null, createConfig(compilation)); }, - warnings: false, - compress: { - drop_debugger: true, - drop_console: true + extraFiles: [] + }), */ + // http://vuejs.github.io/vue-loader/en/workflow/production.html + new webpack.DefinePlugin({ + 'process.env': env + }), + // new ParallelUglifyPlugin({ + // cacheDir: '.cache/', + // uglifyJS: { + // output: { + // comments: false + // }, + // warnings: false, + // compress: { + // drop_debugger: true, + // drop_console: true + // } + // } + // }), + // extract css into its own file + new ExtractTextPlugin({ + filename: utils.assetsPath('css/[name].[contenthash].css'), + // Setting the following option to `false` will not extract CSS from codesplit chunks. + // Their CSS will instead be inserted dynamically with style-loader when the codesplit chunk has been loaded by webpack. + // It's currently set to `true` because we are seeing that sourcemaps are included in the codesplit bundle as well when it's `false`, + // increasing file size: https://github.com/vuejs-templates/webpack/issues/1110 + allChunks: true + }), + // Compress extracted CSS. We are using this plugin so that possible + // duplicated CSS from different components can be deduped. + new OptimizeCSSPlugin({ + cssProcessorOptions: config.build.productionSourceMap + ? { safe: true, map: { inline: false } } + : { safe: true } + }), + // 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({ + favicon: path.resolve(__dirname, '../src/assets/img/favicon.ico'), + filename: config.build.index, + template: 'src/entrance/exportHtml/exportHtml.html', + inlineSource: '.(js|css)$', // embed all javascript and css inline + hash: false, + inject: true, + minify: { + removeComments: true, + collapseWhitespace: true, + removeAttributeQuotes: true + // more options: + // https://github.com/kangax/html-minifier#options-quick-reference + }, + // necessary to consistently work with multiple chunks via CommonsChunkPlugin + chunksSortMode: 'dependency', + chunks: ['exportHtml'], + excludeChunks: ['app'] + }), + new HtmlWebpackInlineSourcePlugin(), + new GenerateAssetPlugin({ + filename: 'static/config.json', + fn: (compilation, cb) => { + cb(null, createJson()) } - } - }), - // extract css into its own file - new ExtractTextPlugin({ - filename: utils.assetsPath('css/[name].[contenthash].css'), - // Setting the following option to `false` will not extract CSS from codesplit chunks. - // Their CSS will instead be inserted dynamically with style-loader when the codesplit chunk has been loaded by webpack. - // It's currently set to `true` because we are seeing that sourcemaps are included in the codesplit bundle as well when it's `false`, - // increasing file size: https://github.com/vuejs-templates/webpack/issues/1110 - allChunks: true - }), - // Compress extracted CSS. We are using this plugin so that possible - // duplicated CSS from different components can be deduped. - new OptimizeCSSPlugin({ - cssProcessorOptions: config.build.productionSourceMap - ? { safe: true, map: { inline: false } } - : { safe: true } - }), - // 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({ - favicon: path.resolve(__dirname, '../src/assets/img/favicon.ico'), - filename: config.build.index, - template: 'src/app/index.html', - hash: false, - inject: true, - minify: { - removeComments: true, - collapseWhitespace: true, - removeAttributeQuotes: true - // more options: - // https://github.com/kangax/html-minifier#options-quick-reference - }, - // necessary to consistently work with multiple chunks via CommonsChunkPlugin - chunksSortMode: 'dependency', - chunks: ['app'] - }), - new GenerateAssetPlugin({ - filename: 'static/config.json', - fn: (compilation, cb) => { - cb(null, createJson()) - } - }), - // keep module.id stable when vendor modules does not change - new webpack.HashedModuleIdsPlugin(), - // enable scope hoisting - new webpack.optimize.ModuleConcatenationPlugin(), - // split vendor js into its own file - new webpack.optimize.CommonsChunkPlugin({ - name: 'vendor', - minChunks (module) { - // any required modules inside node_modules are extracted to vendor - return ( - module.resource && - /\.js$/.test(module.resource) && - module.resource.indexOf( - path.join(__dirname, '../node_modules') - ) === 0 - ) - } - }), - // extract webpack runtime and module manifest to its own file in order to - // prevent vendor hash from being updated whenever app bundle is updated - new webpack.optimize.CommonsChunkPlugin({ - name: 'manifest', - minChunks: Infinity - }), - // This instance extracts shared chunks from code splitted chunks and bundles them - // in a separate chunk, similar to the vendor chunk - // see: https://webpack.js.org/plugins/commons-chunk-plugin/#extra-async-commons-chunk - new webpack.optimize.CommonsChunkPlugin({ - name: 'app', - async: 'vendor-async', - children: true, - minChunks: 3 - }), + }), + // keep module.id stable when vendor modules does not change + new webpack.HashedModuleIdsPlugin(), + // enable scope hoisting + new webpack.optimize.ModuleConcatenationPlugin(), + // split vendor js into its own file + // new webpack.optimize.CommonsChunkPlugin({ + // name: 'vendor', + // minChunks (module) { + // // any required modules inside node_modules are extracted to vendor + // return ( + // module.resource && + // /\.js$/.test(module.resource) && + // module.resource.indexOf( + // path.join(__dirname, '../node_modules') + // ) === 0 + // ) + // } + // }), + // extract webpack runtime and module manifest to its own file in order to + // prevent vendor hash from being updated whenever app bundle is updated + // new webpack.optimize.CommonsChunkPlugin({ + // name: 'manifest', + // minChunks: Infinity + // }), + // This instance extracts shared chunks from code splitted chunks and bundles them + // in a separate chunk, similar to the vendor chunk + // see: https://webpack.js.org/plugins/commons-chunk-plugin/#extra-async-commons-chunk + // new webpack.optimize.CommonsChunkPlugin({ + // name: 'entrance', + // async: 'vendor-async', + // children: true, + // minChunks: 3 + // }), - // copy custom static assets - new CopyWebpackPlugin([ - { - from: path.resolve(__dirname, '../static'), - to: config.build.assetsSubDirectory, - ignore: ['*'] - }, - { - from: path.resolve(__dirname, '../src/components/chart'), - to: 'components', - ignore: ['.*'] - } - ]) - ] -}) + // copy custom static assets + new CopyWebpackPlugin([ + { + from: path.resolve(__dirname, '../static'), + to: config.build.assetsSubDirectory, + ignore: ['*'] + } + ]) + ] + }) +} else if (arg === 'app') { + webpackConfig = merge(baseWebpackConfig, { + 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].js'), + chunkFilename: utils.assetsPath('js/[name].[chunkhash].js') + }, + plugins: [ + /* new GenerateAssetPlugin({ + filename: 'config.json', + fn: (compilation, cb) => { + cb(null, createConfig(compilation)); + }, + extraFiles: [] + }), */ + // http://vuejs.github.io/vue-loader/en/workflow/production.html + new webpack.DefinePlugin({ + 'process.env': env + }), + // new ParallelUglifyPlugin({ + // cacheDir: '.cache/', + // uglifyJS: { + // output: { + // comments: false + // }, + // warnings: false, + // compress: { + // drop_debugger: true, + // drop_console: true + // } + // } + // }), + // extract css into its own file + new ExtractTextPlugin({ + filename: utils.assetsPath('css/[name].[contenthash].css'), + // Setting the following option to `false` will not extract CSS from codesplit chunks. + // Their CSS will instead be inserted dynamically with style-loader when the codesplit chunk has been loaded by webpack. + // It's currently set to `true` because we are seeing that sourcemaps are included in the codesplit bundle as well when it's `false`, + // increasing file size: https://github.com/vuejs-templates/webpack/issues/1110 + allChunks: true + }), + // Compress extracted CSS. We are using this plugin so that possible + // duplicated CSS from different components can be deduped. + new OptimizeCSSPlugin({ + cssProcessorOptions: config.build.productionSourceMap + ? { safe: true, map: { inline: false } } + : { safe: true } + }), + // 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({ + favicon: path.resolve(__dirname, '../src/assets/img/favicon.ico'), + filename: config.build.index, + template: 'src/entrance/app/index.html', + hash: true, + inject: true, + minify: { + removeComments: true, + collapseWhitespace: true, + removeAttributeQuotes: true + // more options: + // https://github.com/kangax/html-minifier#options-quick-reference + }, + // necessary to consistently work with multiple chunks via CommonsChunkPlugin + chunksSortMode: 'dependency', + excludeChunks: ['exportHtml'] + }), + new GenerateAssetPlugin({ + filename: 'static/config.json', + fn: (compilation, cb) => { + cb(null, createJson()) + } + }), + // keep module.id stable when vendor modules does not change + new webpack.HashedModuleIdsPlugin(), + // enable scope hoisting + new webpack.optimize.ModuleConcatenationPlugin(), + // split vendor js into its own file + new webpack.optimize.CommonsChunkPlugin({ + name: 'vendor', + minChunks (module) { + // any required modules inside node_modules are extracted to vendor + return ( + module.resource && + /\.js$/.test(module.resource) && + module.resource.indexOf( + path.join(__dirname, '../node_modules') + ) === 0 + ) + } + }), + // extract webpack runtime and module manifest to its own file in order to + // prevent vendor hash from being updated whenever app bundle is updated + new webpack.optimize.CommonsChunkPlugin({ + name: 'manifest', + minChunks: Infinity + }), + // This instance extracts shared chunks from code splitted chunks and bundles them + // in a separate chunk, similar to the vendor chunk + // see: https://webpack.js.org/plugins/commons-chunk-plugin/#extra-async-commons-chunk + new webpack.optimize.CommonsChunkPlugin({ + name: 'app', + async: 'vendor-async', + children: true, + minChunks: 3 + }), + // copy custom static assets + new CopyWebpackPlugin([ + { + from: path.resolve(__dirname, '../static'), + to: config.build.assetsSubDirectory, + ignore: ['*'] + } + ]) + ] + }) +} if (process.env.NODE_ENV == 'development') { webpackConfig.plugins.push( new fileManagerPlugin({ diff --git a/nezha-fronted/package.json b/nezha-fronted/package.json index f89955f1b..1b34ace32 100644 --- a/nezha-fronted/package.json +++ b/nezha-fronted/package.json @@ -6,9 +6,10 @@ "private": true, "scripts": { "dev": "node --max-old-space-size=10240 ./node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --progress --config build/webpack.dev.conf.js", - "dev:html": "node --max-old-space-size=10240 ./node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --progress --config build/webpack.dev.only-html.conf.js", + "dev:html": "node --max-old-space-size=10240 ./node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --progress --config build/webpack.dev.conf.js", "start": "npm run dev", - "build": "node build/build.js", + "build": "node build/build.js app", + "build:html": "node build/build.js html", "lint": "eslint --fix --ext .js,.vue src", "unit": "jest --config test/unit/jest.conf.js --coverage" }, diff --git a/nezha-fronted/src/components/common/js/validate.js b/nezha-fronted/src/components/common/js/validate.js index 26503f795..a2914ae63 100644 --- a/nezha-fronted/src/components/common/js/validate.js +++ b/nezha-fronted/src/components/common/js/validate.js @@ -1,4 +1,4 @@ -import vm from '../../../app/main' +import vm from '../../../entrance/app/main' import lodash from 'lodash' // ipv4 ip校验 diff --git a/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue b/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue index 4bda2ee19..c9d9e6369 100644 --- a/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue +++ b/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue @@ -587,7 +587,7 @@ import pipelineSelect from './pipelineSelect' import selectWalk from '../popBox/selectWalk' import editRigthBox from '../mixin/editRigthBox' import VueTagsInput from '@johmun/vue-tags-input' -import vm from '@/app/main' +import vm from '@/entrance/app/main' export default { name: 'editEndpointBoxNew', diff --git a/nezha-fronted/src/components/common/rightBox/ipDetailsBox.vue b/nezha-fronted/src/components/common/rightBox/ipDetailsBox.vue index 06bd25e13..ec984e5ed 100644 --- a/nezha-fronted/src/components/common/rightBox/ipDetailsBox.vue +++ b/nezha-fronted/src/components/common/rightBox/ipDetailsBox.vue @@ -44,7 +44,7 @@