feat：配置多入口以及对应的打包方案

2022-05-05 18:22:18 +08:00
parent 48f7d71889
commit 7c9ed7eec3
24 changed files with 602 additions and 672 deletions
--- 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

--- 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()

--- 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 }
--- 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([
--- a/nezha-fronted/build/webpack.dev.only-html.conf.js
+++ b/nezha-fronted/build/webpack.dev.only-html.conf.js
@@ -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)
-    }
-  })
-})
--- a/nezha-fronted/build/webpack.prod-html.conf.js
+++ b/nezha-fronted/build/webpack.prod-html.conf.js
@@ -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
--- 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,6 +33,7 @@ const createConfig = function(compilation){
  return JSON.stringify(cfgJson);
 } */
 let webpackConfig = {}
+if (arg === 'html') {
  webpackConfig = merge(baseWebpackConfig, {
    module: {
      rules: utils.styleLoaders({
@@ -60,19 +60,19 @@ webpackConfig = merge(baseWebpackConfig, {
      new webpack.DefinePlugin({
        'process.env': env
      }),
-    new ParallelUglifyPlugin({
-      cacheDir: '.cache/',
-      uglifyJS: {
-        output: {
-          comments: false
-        },
-        warnings: false,
-        compress: {
-          drop_debugger: true,
-          drop_console: true
-        }
-      }
-    }),
+      // 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'),
@@ -95,7 +95,8 @@ webpackConfig = merge(baseWebpackConfig, {
      new HtmlWebpackPlugin({
        favicon: path.resolve(__dirname, '../src/assets/img/favicon.ico'),
        filename: config.build.index,
-      template: 'src/app/index.html',
+        template: 'src/entrance/exportHtml/exportHtml.html',
+        inlineSource: '.(js|css)$', // embed all javascript and css inline
        hash: false,
        inject: true,
        minify: {
@@ -107,7 +108,135 @@ webpackConfig = merge(baseWebpackConfig, {
        },
        // necessary to consistently work with multiple chunks via CommonsChunkPlugin
        chunksSortMode: 'dependency',
-      chunks: ['app']
+        chunks: ['exportHtml'],
+        excludeChunks: ['app']
+      }),
+      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: ['*']
+        }
+      ])
+    ]
+  })
+} 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',
@@ -155,16 +284,11 @@ webpackConfig = merge(baseWebpackConfig, {
          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({
--- 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"
  },
--- 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校验
--- 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',
--- a/nezha-fronted/src/components/common/rightBox/ipDetailsBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/ipDetailsBox.vue
@@ -44,7 +44,7 @@

 <script>
 import editRigthBox from '../mixin/editRigthBox'
-import vm from '../../../app/main'
+import vm from '../../../entrance/app/main'

 export default {
  name: 'ipDetailsBox',
--- a/nezha-fronted/src/components/common/rightBox/ipamBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/ipamBox.vue
@@ -82,7 +82,7 @@

 <script>
 import editRigthBox from '../mixin/editRigthBox'
-import vm from '../../../app/main'
+import vm from '../../../entrance/app/main'

 export default {
  name: 'ipamBox',
--- a/nezha-fronted/src/components/page/config/licenseGen.vue
+++ b/nezha-fronted/src/components/page/config/licenseGen.vue
@@ -45,7 +45,7 @@
 </template>

 <script>
-import vm from '../../../app/main'
+import vm from '../../../entrance/app/main'

 export default {
  name: 'licenseGen',
--- a/nezha-fronted/src/components/page/dashboard/overview/chartConfig.vue
+++ b/nezha-fronted/src/components/page/dashboard/overview/chartConfig.vue
@@ -1,6 +1,6 @@
 <script>
 import bus from '../../../../libs/bus'
-import vm from '../../../../app/main'
+import vm from '../../../../entrance/app/main'
 window.onload = function () {
  commonOption.toolbox.feature.dataZoom.title.zoom = vm.$i18n.t('overall.toolBox.zoom')
  commonOption.toolbox.feature.dataZoom.title.back = vm.$i18n.t('overall.toolBox.back')
--- a/nezha-fronted/src/entrance/app/App.vue
+++ b/nezha-fronted/src/entrance/app/App.vue
@@ -15,7 +15,6 @@ export default {
    browserWindowZoom
  },
  async created () {
-    console.log(12312312312312312313123)
    const herfSpiltArr = window.location.href.split('/')
    if (herfSpiltArr[3] !== '#') {
      herfSpiltArr[3] = '#'
--- a/nezha-fronted/src/entrance/app/index.html
+++ b/nezha-fronted/src/entrance/app/index.html
--- a/nezha-fronted/src/entrance/app/main.js
+++ b/nezha-fronted/src/entrance/app/main.js
@@ -9,7 +9,7 @@ import i18n from '@/components/common/i18n'
 import Vue from 'vue'
 import Vuex from 'vuex'
 import store from '@/store/index'
-import App from '@/app/App'
+import App from './App'
 import router from '@/router'
 import VueResource from 'vue-resource'
 import axios from 'axios'
--- a/nezha-fronted/src/entrance/entrance.router.js
+++ b/nezha-fronted/src/entrance/entrance.router.js
@@ -1,21 +0,0 @@
-import Vue from 'vue'
-import VueRouter from 'vue-router'
-import Home from '@/components/layout/home'
-console.log('app.router2')
-Vue.use(VueRouter)
-
-const routes = [
-  {
-    path: '/',
-    name: 'Home',
-    component: Home
-  }
-]
-
-const router = new VueRouter({
-  mode: 'history',
-  base: process.env.BASE_URL,
-  routes
-})
-
-export default router
--- a/nezha-fronted/src/entrance/exportHtml/App.vue
+++ b/nezha-fronted/src/entrance/exportHtml/App.vue
@@ -1,5 +1,5 @@
 <template>
-  <div id="entrance" class="theme-light">
+  <div id="entrance" class="theme-light body">
    <chartList
      ref="chartList"
      name="panel"
--- a/nezha-fronted/src/entrance/exportHtml/exportHtml.html
+++ b/nezha-fronted/src/entrance/exportHtml/exportHtml.html
--- a/nezha-fronted/src/entrance/exportHtml/exportHtml.js
+++ b/nezha-fronted/src/entrance/exportHtml/exportHtml.js
@@ -8,55 +8,25 @@ import i18n from '@/components/common/i18n'

 import Vue from 'vue'
 import Vuex from 'vuex'
-import store from '@/store/index'
-import App from './entrance.vue'
-import router from './entrance.router'
+import store from '@/store/exportHtml'
+import App from './App.vue'
+import router from '@/router/exportHtmlRouter'
 import VueResource from 'vue-resource'
 import axios from 'axios'
-import { hasPermission, hasButton } from '@/permission'
+import { hasPermission } from '@/permission'
 import loadsh from 'lodash'
-import plTable from 'pl-table'
-import 'pl-table/themes/index.css'

 import { post, get, put, del } from '@/http.js'
 import { clickoutside, bottomBoxWindow, stringTimeParseToUnix, unixTimeParseToString, chartResizeTool, tableSet, cancelWithChange, myLoading } from '@/components/common/js/tools.js'
 import * as tools from '@/components/common/js/tools.js'
 import * as constants from '@/components/common/js/constants.js'

-import Pagination from '@/components/common/pagination' // 引入全局分页组件
-import searchInput from '@/components/common/searchInput' // 搜索框组件
-import elementSet from '@/components/common/elementSet' // 自定义表头组件
-import MyElSelect from '@/components/common/elSelect/MyElSelect'
 import chartList from '@/components/chart/chartList.vue' // 全局引入 chartList 组件 防止 chart-group爆粗

-import loading from '@/components/common/loading'
 import pickTime from '@/components/common/pickTime'
-import myDatePicker from '@/components/common/myDatePicker'
-import vSelectPage from '@/components/common/v-selectpagenew'
 import nzDataList from '@/components/common/table/nzDataList'
-import htmlToPdf from '@/components/common/js/htmlToPdf'
 import mainMixin from '@/components/common/mixin/mainMixinFun'
-window.entrance = true
-Vue.use(htmlToPdf)
-Vue.use(vSelectPage, {
-  dataLoad: function (vue, url, params) {
-    if (params.pageNumber) {
-      params.pageNo = params.pageNumber
-    }
-    return new Promise((resolve, reject) => {
-      get(url, params).then(res => {
-        resolve(res)
-      }, e => reject(e))
-    })
-  }
-})
-Vue.use(myDatePicker)
-Vue.component('Pagination', Pagination)
-Vue.component('searchInput', searchInput)
-Vue.component('element-set', elementSet)
-Vue.component('loading', loading)
 Vue.component('pick-time', pickTime)
-Vue.component('myDatePicker', myDatePicker)
 Vue.component('nzDataList', nzDataList)
 Vue.component('chartList', chartList)

@@ -121,8 +91,6 @@ Vue.config.productionTip = false
 Vue.use(ElementUI)
 Vue.use(Vuex)
 Vue.use(VueResource)
-Vue.use(plTable)
-Vue.component('el-select', MyElSelect)
 Vue.use(hasPermission)

 /* 指令 */
--- a/nezha-fronted/src/router/exportHtmlRouter/index.js
+++ b/nezha-fronted/src/router/exportHtmlRouter/index.js
@@ -0,0 +1,11 @@
+import Vue from 'vue'
+import Router from 'vue-router'
+Vue.use(Router)
+export default new Router({
+  routes: [
+    {
+      path: '/',
+      component: resolve => require(['@/components/layout/home'], resolve)
+    }
+  ]
+})
--- a/nezha-fronted/src/router/index.js
+++ b/nezha-fronted/src/router/index.js
@@ -1,8 +1,6 @@
 import Vue from 'vue'
 import Router from 'vue-router'
-
 Vue.use(Router)
-console.log('app.router')
 export default new Router({
  routes: [
    {
@@ -11,19 +9,19 @@ export default new Router({
    },
    {
      path: '/login',
-      component: resolve => require(['../components/common/login.vue'], resolve)
+      component: resolve => require(['@/components/common/login'], resolve)
    },
    {
      path: '/setup',
-      component: resolve => require(['../components/page/config/setup.vue'], resolve)
+      component: resolve => require(['@/components/page/config/setup'], resolve)
    },
    {
      path: '/',
-      component: resolve => require(['../components/layout/home.vue'], resolve),
+      component: resolve => require(['@/components/layout/home'], resolve),
      children: [
        {
          path: '/panel',
-          component: resolve => require(['../components/page/dashboard/panel.vue'], resolve)
+          component: resolve => require(['@/components/page/dashboard/panel'], resolve)
        },
        {
          path: '/explore',
@@ -31,88 +29,88 @@ export default new Router({
        },
        {
          path: '/overview',
-          component: resolve => require(['../components/page/dashboard/overview/overview.vue'], resolve)
+          component: resolve => require(['@/components/page/dashboard/overview/overview'], resolve)
        },
        {
          path: '/project',
-          component: resolve => require(['../components/page/monitor/project/index.vue'], resolve)
+          component: resolve => require(['@/components/page/monitor/project/index'], resolve)
        },
        {
          path: '/module',
          name: '/module',
-          component: resolve => require(['../components/page/monitor/module/moduleList.vue'], resolve)
+          component: resolve => require(['@/components/page/monitor/module/moduleList'], resolve)
        },
        {
          path: '/endpoint',
-          component: resolve => require(['../components/page/monitor/endpoint/endpointList.vue'], resolve)
+          component: resolve => require(['@/components/page/monitor/endpoint/endpointList'], resolve)
        },
        {
          path: '/asset',
-          component: resolve => require(['../components/page/asset/asset.vue'], resolve)
+          component: resolve => require(['@/components/page/asset/asset'], resolve)
        },
        {
          path: '/user',
-          component: resolve => require(['../components/page/config/user.vue'], resolve)
+          component: resolve => require(['@/components/page/config/user'], resolve)
        },
        {
          path: '/menu',
-          component: resolve => require(['../components/page/config/menus.vue'], resolve)
+          component: resolve => require(['@/components/page/config/menus'], resolve)
        },
        {
          path: '/roles',
-          component: resolve => require(['../components/page/config/roles.vue'], resolve)
+          component: resolve => require(['@/components/page/config/roles'], resolve)
        },
        {
          path: '/agent',
-          component: resolve => require(['../components/page/config/agent.vue'], resolve)
+          component: resolve => require(['@/components/page/config/agent'], resolve)
        },
        {
          path: '/assetType',
-          component: resolve => require(['../components/page/config/assetType.vue'], resolve)
+          component: resolve => require(['@/components/page/config/assetType'], resolve)
        },
        {
          path: '/assetState',
-          component: resolve => require(['../components/page/config/assetState.vue'], resolve)
+          component: resolve => require(['@/components/page/config/assetState'], resolve)
        },
        {
          path: '/assetLabel',
-          component: resolve => require(['../components/page/config/assetMeta.vue'], resolve)
+          component: resolve => require(['@/components/page/config/assetMeta'], resolve)
        },
        {
          path: '/dc',
-          component: resolve => require(['../components/page/config/dc.vue'], resolve)
+          component: resolve => require(['@/components/page/config/dc'], resolve)
        },
        {
          path: '/model',
-          component: resolve => require(['../components/page/config/model.vue'], resolve)
+          component: resolve => require(['@/components/page/config/model'], resolve)
        },
        {
          path: '/terminalLog',
-          component: resolve => require(['../components/page/config/terminalLog.vue'], resolve)
+          component: resolve => require(['@/components/page/config/terminalLog'], resolve)
        },
        {
          path: '/operationLog',
-          component: resolve => require(['../components/page/config/operationLog.vue'], resolve)
+          component: resolve => require(['@/components/page/config/operationLog'], resolve)
        },
        {
          path: '/about',
-          component: resolve => require(['../components/page/config/about.vue'], resolve)
+          component: resolve => require(['@/components/page/config/about'], resolve)
        },
        {
          path: '/ipam',
-          component: resolve => require(['../components/page/config/ipam.vue'], resolve)
+          component: resolve => require(['@/components/page/config/ipam'], resolve)
        },
        {
          path: '/license/gen',
-          component: resolve => require(['../components/page/config/licenseGen.vue'], resolve)
+          component: resolve => require(['@/components/page/config/licenseGen'], resolve)
        },
        {
          path: '/profile',
-          component: resolve => require(['../components/page/config/profile.vue'], resolve)
+          component: resolve => require(['@/components/page/config/profile'], resolve)
        },
        {
          path: '/mib/:tab',
-          component: resolve => require(['../components/page/config/snmp.vue'], resolve)
+          component: resolve => require(['@/components/page/config/snmp'], resolve)
        },
        // {
        //   path: '/snmp',
@@ -120,55 +118,55 @@ export default new Router({
        // },
        {
          path: '/mib',
-          component: resolve => require(['../components/page/config/mib.vue'], resolve)
+          component: resolve => require(['@/components/page/config/mib'], resolve)
        },
        {
          path: '/mibBrowser',
-          component: resolve => require(['../components/page/config/mibBrowser.vue'], resolve)
+          component: resolve => require(['@/components/page/config/mibBrowser'], resolve)
        },
        {
          path: '/credentials',
-          component: resolve => require(['../components/page/config/credentials.vue'], resolve)
+          component: resolve => require(['@/components/page/config/credentials'], resolve)
        },
        {
          path: '/system',
-          component: resolve => require(['../components/page/config/basic.vue'], resolve)
+          component: resolve => require(['@/components/page/config/basic'], resolve)
        },
        {
          path: '/notification',
-          component: resolve => require(['../components/page/config/system/notifyMethodTab.vue'], resolve)
+          component: resolve => require(['@/components/page/config/system/notifyMethodTab'], resolve)
        },
        {
          path: '/apiKey',
-          component: resolve => require(['../components/page/config/system/apiKeyTab.vue'], resolve)
+          component: resolve => require(['@/components/page/config/system/apiKeyTab'], resolve)
        },
        {
          path: '/license',
-          component: resolve => require(['../components/page/config/system/license.vue'], resolve)
+          component: resolve => require(['@/components/page/config/system/license'], resolve)
        },
        {
          path: '/link',
-          component: resolve => require(['../components/page/config/system/linkTab.vue'], resolve)
+          component: resolve => require(['@/components/page/config/system/linkTab'], resolve)
        },
        {
          path: '/appearance',
-          component: resolve => require(['../components/page/config/basic.vue'], resolve)
+          component: resolve => require(['@/components/page/config/basic'], resolve)
        },
        {
          path: '/email',
-          component: resolve => require(['../components/page/config/email.vue'], resolve)
+          component: resolve => require(['@/components/page/config/email'], resolve)
        },
        {
          path: '/ldap',
-          component: resolve => require(['../components/page/config/ldap.vue'], resolve)
+          component: resolve => require(['@/components/page/config/ldap'], resolve)
        },
        {
          path: '/monitor',
-          component: resolve => require(['../components/page/config/monitor.vue'], resolve)
+          component: resolve => require(['@/components/page/config/monitor'], resolve)
        },
        {
          path: '/terminal',
-          component: resolve => require(['../components/page/config/terminal.vue'], resolve)
+          component: resolve => require(['@/components/page/config/terminal'], resolve)
        },
        {
          path: '/i18n',
@@ -176,35 +174,35 @@ export default new Router({
        },
        {
          path: '/alertMessage',
-          component: resolve => require(['../components/page/alert/alertMessage.vue'], resolve)
+          component: resolve => require(['@/components/page/alert/alertMessage'], resolve)
        },
        {
          path: '/alertRule',
-          component: resolve => require(['../components/page/alert/alertRule.vue'], resolve)
+          component: resolve => require(['@/components/page/alert/alertRule'], resolve)
        },
        {
          path: '/alertSilence',
-          component: resolve => require(['../components/page/alert/alertSilence.vue'], resolve)
+          component: resolve => require(['@/components/page/alert/alertSilence'], resolve)
        },
        {
          path: '/exprTemp',
-          component: resolve => require(['../components/page/config/template/exprTemp.vue'], resolve)
+          component: resolve => require(['@/components/page/config/template/exprTemp'], resolve)
        },
        {
          path: '/chartTemp',
-          component: resolve => require(['../components/page/config/template/chartTemp.vue'], resolve)
+          component: resolve => require(['@/components/page/config/template/chartTemp'], resolve)
        },
        {
          path: '/backup',
-          component: resolve => require(['../components/page/config/backups.vue'], resolve)
+          component: resolve => require(['@/components/page/config/backups'], resolve)
        },
        {
          path: '/ping',
-          component: resolve => require(['../components/page/tool/ping.vue'], resolve)
+          component: resolve => require(['@/components/page/tool/ping'], resolve)
        },
        {
          path: '/trace',
-          component: resolve => require(['../components/page/tool/trace.vue'], resolve)
+          component: resolve => require(['@/components/page/tool/trace'], resolve)
        }
      ]
    }
--- a/nezha-fronted/src/store/exportHtml.js
+++ b/nezha-fronted/src/store/exportHtml.js
@@ -0,0 +1,214 @@
+import Vue from 'vue'
+import Vuex from 'vuex'
+import panel from './panel'
+// import topology from './topology'
+
+Vue.use(Vuex)
+const store = new Vuex.Store({
+  modules: {
+    panel
+  },
+  state: {
+    /* 监听对象变化，用于顶部菜单与底部内容的同步 */
+    currentProject: { id: '', name: '', remark: '' },
+    currentDc: null,
+    projectListChange: 0,
+    reloadFacade: true, // 重新加载project
+    showPanel: {
+      id: 0,
+      name: '',
+      type: 'dashboard'
+    },
+    consoleShow: false, // 是否显示console窗口
+    consoleCount: 0, // 当前console窗口数
+    isAddConsole: false, // 是否增加窗口
+    consoleParam: {}, // 新开console窗口参数
+    linkData: [], // 导航数据
+    projectFilter: {
+      panelId: 0,
+      start_time: '',
+      end_time: '',
+      searchName: ''
+    },
+    idcArr: [],
+    overViewProject: {},
+    dcDataRefresh: false,
+    showTopoScreen: false,
+    logo: '',
+    isShrink: localStorage.getItem('nz-left-menu-shrink') == 'true',
+    metricsList: [],
+    langList: [],
+    i18nReady: false,
+    timeFormatMain: localStorage.getItem('nz-default-dateFormat') || 'YYYY-MM-DD HH:mm:ss',
+    globalShow: false,
+    globalSearchId: '',
+    isRouteLive: true,
+    nowPath: ''
+  },
+  getters: {
+    getGlobalSearchId (state) {
+      return state.globalSearchId
+    },
+    getTimeFormatMain (state) {
+      return state.timeFormatMain
+    },
+    getGlobalShow (state) {
+      return state.globalShow
+    },
+    getLinkData (state) {
+      return state.linkData
+    },
+    getProjectFilter (state) {
+      return state.projectFilter
+    },
+    getReloadFacade (state) {
+      return state.reloadFacade
+    },
+    getIdcArr (state) {
+      return state.idcArr
+    },
+    getOverViewProject (state) {
+      return state.overViewProject
+    },
+    getDcDataRefresh (state) {
+      return state.dcDataRefresh
+    },
+    getCurrentProject (state) {
+      return state.currentProject
+    },
+    getShowTopoScreen (state) {
+      return state.showTopoScreen
+    },
+    getLogo (state) {
+      return state.logo
+    },
+    getIsShrink (state) {
+      return state.isShrink
+    },
+    getMetricsList (state) {
+      return state.metricsList
+    },
+    getLangList (state) {
+      return state.langList
+    },
+    getIsRouteLive (state) {
+      return state.isRouteLive
+    },
+    getNowPath (state) {
+      return state.nowPath
+    },
+    i18nIsReady (state) {
+      return state.i18nReady
+    }
+  },
+  mutations: {
+    /* 监听对象变化，用于顶部菜单与底部内容的同步 */
+    projectListChange (state) {
+      state.projectListChange++
+    },
+    currentProjectChange (state, project) {
+      state.currentProject = project
+    },
+    setGlobalSearchId (state, id) {
+      state.globalSearchId = id
+    },
+    panelShowPanelChange (state, panel) { // 用来panel页控制初始panel的
+      state.showPanel.id = panel.id
+      state.showPanel.name = panel.name
+    },
+
+    openConsole (state) { // 打开console，如果当前窗口数为0，则默认新建一个console
+      state.consoleShow = true
+    },
+    addConsole (state, data) { // 打开console，并新建一个console
+      state.consoleShow = true
+      state.isAddConsole = true
+      state.consoleParam = data
+      setTimeout(() => {
+        state.isAddConsole = false
+      }, 100)
+    },
+    addConsoleNum (state) {
+      state.consoleCount++
+    },
+    removeConsole (state) { // 移除一个console，如果是最后一个，则关闭窗口，否则不关闭窗口
+      state.consoleCount--
+      if (state.consoleCount === 0) {
+        state.consoleShow = false
+      }
+    },
+    closeConsole (state) { // 关闭console窗口
+      state.consoleShow = false
+      state.consoleCount = 0
+      state.consoleParam = {}
+    },
+    minConsole (state) { // 最小化窗口
+      state.consoleShow = false
+    },
+    setLinkData (state, data) {
+      state.linkData = data
+    },
+    setProjectFilter (state, data) {
+      state.projectFilter = data
+    },
+    setReloadFacade (state) {
+      state.reloadFacade = false
+      setTimeout(() => {
+        state.reloadFacade = true
+      })
+    },
+    setIdcArr (state, data) {
+      state.idcArr = data
+    },
+    setCurrentDc (state, data) {
+      state.currentDc = data
+    },
+    setOverViewProject (state, data) {
+      state.overViewProject = data
+    },
+    setDcDataRefresh (state) {
+      state.dcDataRefresh = true
+      setTimeout(() => {
+        state.dcDataRefresh = false
+      }, 100)
+    },
+    setShowTopoScreen (state, boolean) {
+      state.showTopoScreen = boolean
+    },
+    setLogo (state, logo) {
+      state.logo = logo
+    },
+    isShrink (state) {
+      state.isShrink = !state.isShrink
+      localStorage.setItem('nz-left-menu-shrink', state.isShrink)
+    },
+    setMetricsList (state, metricsList) {
+      state.metricsList = [...metricsList]
+    },
+    setLangList (state, langList) {
+      state.langList = langList
+    },
+    setTimeFormatMain (state, timeFormat) {
+      state.timeFormatMain = timeFormat
+    },
+    setGlobalShow (state, globalShow) {
+      state.globalShow = globalShow
+    },
+    setIsRouteLive (state) {
+      state.isRouteLive = false
+      setTimeout(() => {
+        state.isRouteLive = true
+      })
+    },
+    setNowPath (state, path) {
+      state.nowPath = path
+    },
+    i18nReady (state, ready) {
+      state.i18nReady = ready
+    }
+  },
+  actions: {
+  }
+})
+
+export default store