feat：尝试添加vue main.js 多入口

2022-04-29 18:50:01 +08:00
parent 5a21a58dc0
commit 95211b49ed
27 changed files with 1052 additions and 97133 deletions
--- a/.gitignore
+++ b/.gitignore
@@ -0,0 +1,18 @@
+.DS_Store
+node_modules/
+/dist/
+/static/
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# Editor directories and files
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+nezha-fronted/src/router/mergeTable.js
+nezha-fronted/src/components/page/dashboard/testData.js
+nezha-fronted/src/components/common/rightBox/tempRoghtBox.vue
--- a/nezha-fronted/build/build.js
+++ b/nezha-fronted/build/build.js
@@ -1,9 +1,10 @@
 'use strict'
 require('./check-versions')()

-let arg = process.argv.splice(2)[0];
-process.env.NODE_ENV = arg == 'dev' ? 'development' : 'production'
+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')
--- a/nezha-fronted/build/webpack.base.conf.js
+++ b/nezha-fronted/build/webpack.base.conf.js
@@ -3,15 +3,39 @@ const path = require('path')
 const utils = require('./utils')
 const config = require('../config')
 const vueLoaderConfig = require('./vue-loader.conf')
-
+console.log(process.env.ONLY_HTML)
 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 = {
  context: path.resolve(__dirname, '../'),
  entry: {
-    app: './src/main.js'
+    app: './src/main.js',
+    entrance: './src/entrance/entrance.main.js'
  },
  output: {
    path: config.build.assetsRoot,
@@ -96,5 +120,6 @@ module.exports = {
    net: 'empty',
    tls: 'empty',
    child_process: 'empty'
-  }
+  },
+  ...onlyHtml
 }
--- a/nezha-fronted/build/webpack.dev.conf.js
+++ b/nezha-fronted/build/webpack.dev.conf.js
@@ -58,7 +58,8 @@ const devWebpackConfig = merge(baseWebpackConfig, {
      favicon: path.resolve(__dirname, '../src/assets/img/favicon.ico'),
      filename: 'index.html',
      template: 'index.html',
-      inject: true
+      inject: true,
+      chunks: ['entrance']
    }),
    // 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
@@ -0,0 +1,105 @@
+'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, 'index.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: 'entrance.html',
+      inject: true,
+      chunks: ['app']
+    }),
+    // 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.conf.js
+++ b/nezha-fronted/build/webpack.prod.conf.js
@@ -6,6 +6,7 @@ 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')
@@ -16,8 +17,8 @@ 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 () {
@@ -32,7 +33,9 @@ const createConfig = function(compilation){
  let cfgJson={baseUrl:"http://192.168.40.247:8080/nz-admin"};
  return JSON.stringify(cfgJson);
 } */
-const webpackConfig = merge(baseWebpackConfig, {
+let webpackConfig = {}
+if (!process.env.ONLY_HTML) {
+  webpackConfig = merge(baseWebpackConfig, {
    module: {
      rules: utils.styleLoaders({
        sourceMap: config.build.productionSourceMap,
@@ -104,7 +107,8 @@ const webpackConfig = merge(baseWebpackConfig, {
          // https://github.com/kangax/html-minifier#options-quick-reference
        },
        // necessary to consistently work with multiple chunks via CommonsChunkPlugin
-      chunksSortMode: 'dependency'
+        chunksSortMode: 'dependency',
+        chunks: ['entrance']
      }),
      new GenerateAssetPlugin({
        filename: 'static/config.json',
@@ -161,6 +165,140 @@ const webpackConfig = merge(baseWebpackConfig, {
      ])
    ]
  })
+} else {
+  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: '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: ['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: ['*']
+        },
+        {
+          from: path.resolve(__dirname, '../src/components/chart'),
+          to: 'components',
+          ignore: ['.*']
+        }
+      ])
+    ]
+  })
+}

 if (process.env.NODE_ENV == 'development') {
  webpackConfig.plugins.push(
@@ -229,7 +367,7 @@ if (process.env.NODE_ENV == 'development') {
          ]
        }
      ]
-    }),
+    })
    // new WebpackZipPlugin({
    //   initialFile: './dist',
    //   endPath: './dist',
--- a/nezha-fronted/config/index.js
+++ b/nezha-fronted/config/index.js
@@ -71,5 +71,5 @@ module.exports = {
    // `npm run build --report`
    // Set to `true` or `false` to always turn it on or off
    bundleAnalyzerReport: process.env.npm_config_report
-  }
+  },
 }
--- a/nezha-fronted/entrance.html
+++ b/nezha-fronted/entrance.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width,initial-scale=1.0">
+  <link rel="icon" href="data:;base64,=">
+  <link href="./favicon.ico" rel="icon" type="image/x-icon"/>
+
+  <title>Network Zodiac</title>
+  <style>
+    * {
+      margin: 0;
+      padding: 0;
+    }
+    @media only screen and (min-width: 10px) and (min-height: 10px){
+      html {
+        font-size: 10px;
+      }
+    }
+    @media only screen and (min-width: 1020px) and (min-height: 560px){
+      html {
+        font-size: 12px;
+      }
+    }
+    @media only screen and (min-width: 1360px) and (min-height: 650px){
+      html {
+        font-size: 14px;
+      }
+    }
+    @media only screen and (min-width: 1700px) and (min-height: 800px){
+      html {
+        font-size: 16px;
+      }
+    }
+  </style>
+</head>
+
+<body class="theme-light">
+<div id="entrance"></div>
+</body>
+
+</html>
--- a/nezha-fronted/package-lock.json
+++ b/nezha-fronted/package-lock.json
@@ -8382,6 +8382,22 @@
        "find-index": "^0.1.1"
      }
    },
+    "global": {
+      "version": "2.0.7",
+      "resolved": "https://registry.npmjs.org/global/-/global-2.0.7.tgz",
+      "integrity": "sha1-1DqcPR7HkV9kXY4OsKxgAQ6eBs0=",
+      "requires": {
+        "min-document": "~0.2.2",
+        "process": "~0.5.1"
+      },
+      "dependencies": {
+        "process": {
+          "version": "0.5.2",
+          "resolved": "https://registry.npmjs.org/process/-/process-0.5.2.tgz",
+          "integrity": "sha1-FjjYqONML0QKkduVq5rrZ3/Bhc8="
+        }
+      }
+    },
    "globals": {
      "version": "9.18.0",
      "resolved": "https://registry.npmjs.org/globals/-/globals-9.18.0.tgz",
@@ -8756,6 +8772,16 @@
      "integrity": "sha1-ELMKOGCF9Dzt41PMj6fLDe7qZos=",
      "dev": true
    },
+    "html-webpack-inline-source-plugin": {
+      "version": "0.0.10",
+      "resolved": "https://registry.npmjs.org/html-webpack-inline-source-plugin/-/html-webpack-inline-source-plugin-0.0.10.tgz",
+      "integrity": "sha512-0ZNU57u7283vrXSF5a4VDnVOMWiSwypKIp1z/XfXWoVHLA1r3Xmyxx5+Lz+mnthz/UvxL1OAf41w5UIF68Jngw==",
+      "requires": {
+        "escape-string-regexp": "^1.0.5",
+        "slash": "^1.0.0",
+        "source-map-url": "^0.4.0"
+      }
+    },
    "html-webpack-plugin": {
      "version": "2.30.1",
      "resolved": "https://registry.npmjs.org/html-webpack-plugin/-/html-webpack-plugin-2.30.1.tgz",
@@ -9037,6 +9063,11 @@
      "integrity": "sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==",
      "dev": true
    },
+    "insert-css": {
+      "version": "0.0.0",
+      "resolved": "https://registry.npmjs.org/insert-css/-/insert-css-0.0.0.tgz",
+      "integrity": "sha1-IwS/pviTq+y4/5yo2cdgXZTPKRE="
+    },
    "internal-ip": {
      "version": "1.2.0",
      "resolved": "https://registry.npmjs.org/internal-ip/-/internal-ip-1.2.0.tgz",
@@ -10806,6 +10837,11 @@
        "graceful-fs": "^4.1.6"
      }
    },
+    "jsonify": {
+      "version": "0.0.0",
+      "resolved": "https://registry.npmjs.org/jsonify/-/jsonify-0.0.0.tgz",
+      "integrity": "sha1-LHS27kHZPKUbe1qu6PUDYx0lKnM="
+    },
    "jspdf": {
      "version": "2.5.1",
      "resolved": "https://registry.npmjs.org/jspdf/-/jspdf-2.5.1.tgz",
@@ -11474,6 +11510,14 @@
      "resolved": "https://registry.npmjs.org/mimic-response/-/mimic-response-1.0.1.tgz",
      "integrity": "sha512-j5EctnkH7amfV/q5Hgmoal1g2QHFJRraOtmx0JpIqkxhBhI/lJSl1nMpQ45hVarwNETOoWEimndZ4QK0RHxuxQ=="
    },
+    "min-document": {
+      "version": "0.2.8",
+      "resolved": "https://registry.npmjs.org/min-document/-/min-document-0.2.8.tgz",
+      "integrity": "sha1-82IM9WA2ERVcuUFtCrVXaxbVPeM=",
+      "requires": {
+        "tape": "~1.0.2"
+      }
+    },
    "minimalistic-assert": {
      "version": "1.0.1",
      "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz",
@@ -15053,6 +15097,24 @@
        }
      }
    },
+    "preload": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/preload/-/preload-0.1.0.tgz",
+      "integrity": "sha1-QAvt7o4p3BVSlV/z3r0EX0BCEwE=",
+      "requires": {
+        "inherits": "~2.0.1",
+        "insert-css": "0.0.0",
+        "once": "~1.2.0",
+        "xhr": "~1.2.3"
+      },
+      "dependencies": {
+        "once": {
+          "version": "1.2.0",
+          "resolved": "https://registry.npmjs.org/once/-/once-1.2.0.tgz",
+          "integrity": "sha1-3hkFxjavh0qPuoYtmqvd0fkgRhw="
+        }
+      }
+    },
    "prelude-ls": {
      "version": "1.2.1",
      "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz",
@@ -16524,8 +16586,7 @@
    "slash": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/slash/-/slash-1.0.0.tgz",
-      "integrity": "sha1-xB8vbDn8FtHNF61LXYlhFK5HDVU=",
-      "dev": true
+      "integrity": "sha1-xB8vbDn8FtHNF61LXYlhFK5HDVU="
    },
    "slice-ansi": {
      "version": "4.0.0",
@@ -16772,8 +16833,7 @@
    "source-map-url": {
      "version": "0.4.0",
      "resolved": "https://registry.npmjs.org/source-map-url/-/source-map-url-0.4.0.tgz",
-      "integrity": "sha1-PpNdfd1zYxuXZZlW1VEo6HtQhKM=",
-      "dev": true
+      "integrity": "sha1-PpNdfd1zYxuXZZlW1VEo6HtQhKM="
    },
    "spdx-correct": {
      "version": "3.1.0",
@@ -17411,6 +17471,29 @@
      "integrity": "sha512-2wsvQ+4GwBvLPLWsNfLCDYGsW6xb7aeC6utq2Qh0PFwgEy7K7dsma9Jsmb2zSQj7GvYAyUGSntLtsv++GmgL1A==",
      "dev": true
    },
+    "tape": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/tape/-/tape-1.0.4.tgz",
+      "integrity": "sha1-4ujlxt0/AP3CpeRRT2L8Ih5Z+cQ=",
+      "requires": {
+        "deep-equal": "~0.0.0",
+        "defined": "~0.0.0",
+        "jsonify": "~0.0.0",
+        "through": "~2.3.4"
+      },
+      "dependencies": {
+        "deep-equal": {
+          "version": "0.0.0",
+          "resolved": "https://registry.npmjs.org/deep-equal/-/deep-equal-0.0.0.tgz",
+          "integrity": "sha1-mWedO70EcVb81FDT0B7rkGhpHoM="
+        },
+        "defined": {
+          "version": "0.0.0",
+          "resolved": "https://registry.npmjs.org/defined/-/defined-0.0.0.tgz",
+          "integrity": "sha1-817qfXBekzuvE7LwOz+D2SFAOz4="
+        }
+      }
+    },
    "tar": {
      "version": "2.2.2",
      "resolved": "https://registry.npmjs.org/tar/-/tar-2.2.2.tgz",
@@ -17664,6 +17747,11 @@
      "resolved": "https://registry.npmjs.org/throttle-debounce/-/throttle-debounce-1.1.0.tgz",
      "integrity": "sha512-XH8UiPCQcWNuk2LYePibW/4qL97+ZQ1AN3FNXwZRBNPPowo/NRU5fAlDCSNBJIYCKbioZfuYtMhG4quqoJhVzg=="
    },
+    "through": {
+      "version": "2.3.8",
+      "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz",
+      "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU="
+    },
    "through2": {
      "version": "2.0.5",
      "resolved": "https://registry.npmjs.org/through2/-/through2-2.0.5.tgz",
@@ -19469,6 +19557,22 @@
      "resolved": "https://registry.npmjs.org/xe-utils/-/xe-utils-2.3.0.tgz",
      "integrity": "sha512-AGb3oZxoktHHk1i1TD/v6aQyUbJUqMNuBp1zMFuNBCT8HjP7OD+C1X/8m14jzxOC1YeXfoHwwYmGDUMgqZnsFg=="
    },
+    "xhr": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/xhr/-/xhr-1.2.4.tgz",
+      "integrity": "sha1-/MpGT80XIjmobSsePTTRK3EsNIo=",
+      "requires": {
+        "global": "~2.0.7",
+        "once": "~1.1.1"
+      },
+      "dependencies": {
+        "once": {
+          "version": "1.1.1",
+          "resolved": "https://registry.npmjs.org/once/-/once-1.1.1.tgz",
+          "integrity": "sha1-nbV0kzzLCMOnYU0VQDLAnqbzOec="
+        }
+      }
+    },
    "xlsx": {
      "version": "0.15.6",
      "resolved": "https://registry.npmjs.org/xlsx/-/xlsx-0.15.6.tgz",
--- a/nezha-fronted/package.json
+++ b/nezha-fronted/package.json
@@ -6,6 +6,7 @@
  "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",
    "start": "npm run dev",
    "build": "node build/build.js",
    "lint": "eslint --fix --ext .js,.vue src",
@@ -39,6 +40,7 @@
    "echarts": "^5.2.2",
    "element-ui": "^2.15.3",
    "file-saver": "^2.0.2",
+    "html-webpack-inline-source-plugin": "0.0.10",
    "html2canvas": "^1.4.1",
    "jspdf": "^2.5.1",
    "jszip": "^3.9.1",
@@ -47,6 +49,7 @@
    "mqtt": "4.2.6",
    "node-sass": "^4.14.1",
    "pl-table": "^2.5.8",
+    "preload": "^0.1.0",
    "qrcodejs2": "0.0.2",
    "quill": "^1.3.7",
    "v-selectpage": "^2.1.4",
--- a/nezha-fronted/src/App.vue
+++ b/nezha-fronted/src/App.vue
@@ -15,6 +15,7 @@ export default {
    browserWindowZoom
  },
  async created () {
+    console.log(12312312312312312313123)
    const herfSpiltArr = window.location.href.split('/')
    if (herfSpiltArr[3] !== '#') {
      herfSpiltArr[3] = '#'
--- a/nezha-fronted/src/components/chart/chartList.vue
+++ b/nezha-fronted/src/components/chart/chartList.vue
@@ -49,6 +49,7 @@
          :from="from"
          :time-range="timeRange"
          @groupShow="groupShow"
+          :isExportHtml="isExportHtml"
          :chart-detail-info="chartDetailInfo"
          @refreshPanel="refreshPanel"
          @showFullscreen="showFullscreen"
@@ -423,12 +424,18 @@ export default {
      this.$store.commit('setChartListId', `chartList${this.timestamp}`)
      window.addEventListener('resize', this.resize)
    }
+    if (this.isExportHtml) {
+      this.$nextTick(() => {
+        this.onScroll(999999)
+      })
+    }
  },
  beforeDestroy () {
    window.removeEventListener('resize', this.resize)
  },
  watch: {
    dataList: {
+      immediate: true,
      deep: true,
      handler (n) {
        this.gridLayoutShow = false
--- a/nezha-fronted/src/components/chart/panelChart.vue
+++ b/nezha-fronted/src/components/chart/panelChart.vue
@@ -87,7 +87,8 @@ export default {
    showHeader: {
      type: Boolean,
      default: true
-    }
+    },
+    isExportHtml: false
  },
  data () {
    return {
@@ -99,8 +100,8 @@ export default {
      showAllData: false,
      allDataLength: 0,
      severityData: this.$store.getters.severityData,
-      severityDataWeight: this.$store.getters.severityDataWeight,
-      isExportData: false
+      severityDataWeight: this.$store.getters.severityDataWeight
+      // isExportData: false
    }
  },
  computed: {
@@ -162,8 +163,25 @@ export default {
    query (elements, startTime, endTime, step, params) {
      this.isError = false
      this.allDataLength = 0
-      if (this.isExportData) {
      this.chartData = this.chartInfo.chartData
+      if (this.isExportHtml) {
+        switch (this.chartInfo.datasource) {
+          case 'metrics':
+          case 'logs': {
+            this.chartData.forEach(item => {
+              item.forEach(children => {
+                children.elements = elements[0]
+              })
+            })
+            this.loading = false
+          }
+            break
+          case 'system': {
+            this.chartInfo.elements = this.chartInfo.param.datasource
+          }
+        }
+        this.loading = false
+        return
      }
      try {
        switch (this.chartInfo.datasource) {
--- a/nezha-fronted/src/components/chart/panelTemp/js/axios.js
+++ b/nezha-fronted/src/components/chart/panelTemp/js/axios.js
--- a/nezha-fronted/src/components/chart/panelTemp/js/echarts.js
+++ b/nezha-fronted/src/components/chart/panelTemp/js/echarts.js
--- a/nezha-fronted/src/components/chart/panelTemp/js/httpVueLoader.js
+++ b/nezha-fronted/src/components/chart/panelTemp/js/httpVueLoader.js
@@ -1,386 +0,0 @@
-(function umd (root, factory) {
-  if (typeof module === 'object' && typeof exports === 'object') { module.exports = factory() } else if (typeof define === 'function' && define.amd) { define([], factory) } else { root.httpVueLoader = factory() }
-})(this, function factory () {
-  'use strict'
-
-  let scopeIndex = 0
-
-  StyleContext.prototype = {
-
-    withBase: function (callback) {
-      let tmpBaseElt
-      if (this.component.baseURI) {
-        // firefox and chrome need the <base> to be set while inserting or modifying <style> in a document.
-        tmpBaseElt = document.createElement('base')
-        tmpBaseElt.href = this.component.baseURI
-
-        const headElt = this.component.getHead()
-        headElt.insertBefore(tmpBaseElt, headElt.firstChild)
-      }
-
-      callback.call(this)
-
-      if (tmpBaseElt) { this.component.getHead().removeChild(tmpBaseElt) }
-    },
-
-    scopeStyles: function (styleElt, scopeName) {
-      function process () {
-        const sheet = styleElt.sheet
-        const rules = sheet.cssRules
-
-        for (let i = 0; i < rules.length; ++i) {
-          const rule = rules[i]
-          if (rule.type !== 1) { continue }
-
-          var scopedSelectors = []
-
-          rule.selectorText.split(/\s*,\s*/).forEach(function (sel) {
-            scopedSelectors.push(scopeName + ' ' + sel)
-            const segments = sel.match(/([^ :]+)(.+)?/)
-            scopedSelectors.push(segments[1] + scopeName + (segments[2] || ''))
-          })
-
-          const scopedRule = scopedSelectors.join(',') + rule.cssText.substr(rule.selectorText.length)
-          sheet.deleteRule(i)
-          sheet.insertRule(scopedRule, i)
-        }
-      }
-
-      try {
-        // firefox may fail sheet.cssRules with InvalidAccessError
-        process()
-      } catch (ex) {
-        if (ex instanceof DOMException && ex.code === DOMException.INVALID_ACCESS_ERR) {
-          styleElt.sheet.disabled = true
-          styleElt.addEventListener('load', function onStyleLoaded () {
-            styleElt.removeEventListener('load', onStyleLoaded)
-
-            // firefox need this timeout otherwise we have to use document.importNode(style, true)
-            setTimeout(function () {
-              process()
-              styleElt.sheet.disabled = false
-            })
-          })
-          return
-        }
-
-        throw ex
-      }
-    },
-
-    compile: function () {
-      const hasTemplate = this.template !== null
-
-      const scoped = this.elt.hasAttribute('scoped')
-
-      if (scoped) {
-        // no template, no scopable style needed
-        if (!hasTemplate) { return }
-
-        // firefox does not tolerate this attribute
-        this.elt.removeAttribute('scoped')
-      }
-
-      this.withBase(function () {
-        this.component.getHead().appendChild(this.elt)
-      })
-
-      if (scoped) { this.scopeStyles(this.elt, '[' + this.component.getScopeId() + ']') }
-
-      return Promise.resolve()
-    },
-
-    getContent: function () {
-      return this.elt.textContent
-    },
-
-    setContent: function (content) {
-      this.withBase(function () {
-        this.elt.textContent = content
-      })
-    }
-  }
-
-  function StyleContext (component, elt) {
-    this.component = component
-    this.elt = elt
-  }
-
-  ScriptContext.prototype = {
-
-    getContent: function () {
-      return this.elt.textContent
-    },
-
-    setContent: function (content) {
-      this.elt.textContent = content
-    },
-
-    compile: function (module) {
-      const childModuleRequire = function (childURL) {
-        return httpVueLoader.require(resolveURL(this.component.baseURI, childURL))
-      }.bind(this)
-
-      const childLoader = function (childURL, childName) {
-        return httpVueLoader(resolveURL(this.component.baseURI, childURL), childName)
-      }.bind(this)
-
-      try {
-        Function('exports', 'require', 'httpVueLoader', 'module', this.getContent()).call(this.module.exports, this.module.exports, childModuleRequire, childLoader, this.module)
-      } catch (ex) {
-        if (!('lineNumber' in ex)) {
-          return Promise.reject(ex)
-        }
-        const vueFileData = responseText.replace(/\r?\n/g, '\n')
-        const lineNumber = vueFileData.substr(0, vueFileData.indexOf(script)).split('\n').length + ex.lineNumber - 1
-        throw new (ex.constructor)(ex.message, url, lineNumber)
-      }
-
-      return Promise.resolve(this.module.exports)
-        .then(httpVueLoader.scriptExportsHandler.bind(this))
-        .then(function (exports) {
-          this.module.exports = exports
-        }.bind(this))
-    }
-  }
-
-  function ScriptContext (component, elt) {
-    this.component = component
-    this.elt = elt
-    this.module = { exports: {} }
-  }
-
-  TemplateContext.prototype = {
-
-    getContent: function () {
-      return this.elt.innerHTML
-    },
-
-    setContent: function (content) {
-      this.elt.innerHTML = content
-    },
-
-    getRootElt: function () {
-      let tplElt = this.elt.content || this.elt
-
-      if ('firstElementChild' in tplElt) { return tplElt.firstElementChild }
-
-      for (tplElt = tplElt.firstChild; tplElt !== null; tplElt = tplElt.nextSibling) {
-        if (tplElt.nodeType === Node.ELEMENT_NODE) { return tplElt }
-      }
-
-      return null
-    },
-
-    compile: function () {
-      return Promise.resolve()
-    }
-  }
-
-  function TemplateContext (component, elt) {
-    this.component = component
-    this.elt = elt
-  }
-
-  Component.prototype = {
-
-    getHead: function () {
-      return document.head || document.getElementsByTagName('head')[0]
-    },
-
-    getScopeId: function () {
-      if (this._scopeId === '') {
-        this._scopeId = 'data-s-' + (scopeIndex++).toString(36)
-        this.template.getRootElt().setAttribute(this._scopeId, '')
-      }
-      return this._scopeId
-    },
-
-    load: function (componentURL) {
-      return httpVueLoader.httpRequest(componentURL)
-        .then(function (responseText) {
-          this.baseURI = componentURL.substr(0, componentURL.lastIndexOf('/') + 1)
-          const doc = document.implementation.createHTMLDocument('')
-
-          // IE requires the <base> to come with <style>
-          doc.body.innerHTML = (this.baseURI ? '<base href="' + this.baseURI + '">' : '') + responseText
-
-          for (let it = doc.body.firstChild; it; it = it.nextSibling) {
-            switch (it.nodeName) {
-              case 'TEMPLATE':
-                this.template = new TemplateContext(this, it)
-                break
-              case 'SCRIPT':
-                this.script = new ScriptContext(this, it)
-                break
-              case 'STYLE':
-                this.styles.push(new StyleContext(this, it))
-                break
-            }
-          }
-
-          return this
-        }.bind(this))
-    },
-
-    _normalizeSection: function (eltCx) {
-      let p
-
-      if (eltCx === null || !eltCx.elt.hasAttribute('src')) {
-        p = Promise.resolve(null)
-      } else {
-        p = httpVueLoader.httpRequest(eltCx.elt.getAttribute('src'))
-          .then(function (content) {
-            eltCx.elt.removeAttribute('src')
-            return content
-          })
-      }
-
-      return p
-        .then(function (content) {
-          if (eltCx !== null && eltCx.elt.hasAttribute('lang')) {
-            const lang = eltCx.elt.getAttribute('lang')
-            eltCx.elt.removeAttribute('lang')
-            return httpVueLoader.langProcessor[lang.toLowerCase()].call(this, content === null ? eltCx.getContent() : content)
-          }
-          return content
-        }.bind(this))
-        .then(function (content) {
-          if (content !== null) { eltCx.setContent(content) }
-        })
-    },
-
-    normalize: function () {
-      return Promise.all(Array.prototype.concat(
-        this._normalizeSection(this.template),
-        this._normalizeSection(this.script),
-        this.styles.map(this._normalizeSection)
-      ))
-        .then(function () {
-          return this
-        }.bind(this))
-    },
-
-    compile: function () {
-      return Promise.all(Array.prototype.concat(
-        this.template && this.template.compile(),
-        this.script && this.script.compile(),
-        this.styles.map(function (style) { return style.compile() })
-      ))
-        .then(function () {
-          return this
-        }.bind(this))
-    }
-  }
-
-  function Component (name) {
-    this.name = name
-    this.template = null
-    this.script = null
-    this.styles = []
-    this._scopeId = ''
-  }
-
-  function identity (value) {
-    return value
-  }
-
-  function parseComponentURL (url) {
-    const comp = url.match(/(.*?)([^/]+?)\/?(\.vue)?(\?.*|#.*|$)/)
-    return {
-      name: comp[2],
-      url: comp[1] + comp[2] + (comp[3] === undefined ? '/index.vue' : comp[3]) + comp[4]
-    }
-  }
-
-  function resolveURL (baseURL, url) {
-    if (url.substr(0, 2) === './' || url.substr(0, 3) === '../') {
-      return baseURL + url
-    }
-    return url
-  }
-
-  httpVueLoader.load = function (url, name) {
-    return function () {
-      return new Component(name).load(url)
-        .then(function (component) {
-          return component.normalize()
-        })
-        .then(function (component) {
-          return component.compile()
-        })
-        .then(function (component) {
-          const exports = component.script !== null ? component.script.module.exports : {}
-
-          if (component.template !== null) { exports.template = component.template.getContent() }
-
-          if (exports.name === undefined) {
-            if (component.name !== undefined) { exports.name = component.name }
-          }
-
-          exports._baseURI = component.baseURI
-
-          return exports
-        })
-    }
-  }
-
-  httpVueLoader.register = function (Vue, url) {
-    const comp = parseComponentURL(url)
-    Vue.component(comp.name, httpVueLoader.load(comp.url))
-  }
-
-  httpVueLoader.install = function (Vue) {
-    Vue.mixin({
-
-      beforeCreate: function () {
-        const components = this.$options.components
-
-        for (const componentName in components) {
-          if (typeof (components[componentName]) === 'string' && components[componentName].substr(0, 4) === 'url:') {
-            const comp = parseComponentURL(components[componentName].substr(4))
-
-            const componentURL = ('_baseURI' in this.$options) ? resolveURL(this.$options._baseURI, comp.url) : comp.url
-
-            if (isNaN(componentName)) { components[componentName] = httpVueLoader.load(componentURL, componentName) } else { components[componentName] = Vue.component(comp.name, httpVueLoader.load(componentURL, comp.name)) }
-          }
-        }
-      }
-    })
-  }
-
-  httpVueLoader.require = function (moduleName) {
-    return window[moduleName]
-  }
-
-  httpVueLoader.httpRequest = function (url) {
-    return new Promise(function (resolve, reject) {
-      const xhr = new XMLHttpRequest()
-      xhr.open('GET', url)
-            		xhr.responseType = 'text'
-
-      xhr.onreadystatechange = function () {
-        if (xhr.readyState === 4) {
-          if (xhr.status >= 200 && xhr.status < 300) { resolve(xhr.responseText) } else { reject(xhr.status) }
-        }
-      }
-
-      xhr.send(null)
-    })
-  }
-
-  httpVueLoader.langProcessor = {
-    html: identity,
-    js: identity,
-    css: identity
-  }
-
-  httpVueLoader.scriptExportsHandler = identity
-
-  function httpVueLoader (url, name) {
-    const comp = parseComponentURL(url)
-    return httpVueLoader.load(comp.url, name)
-  }
-
-  return httpVueLoader
-})
--- a/nezha-fronted/src/components/chart/panelTemp/js/vue.js
+++ b/nezha-fronted/src/components/chart/panelTemp/js/vue.js
--- a/nezha-fronted/src/components/chart/panelTemp/js/vuex.js
+++ b/nezha-fronted/src/components/chart/panelTemp/js/vuex.js
--- a/nezha-fronted/src/components/chart/panelTemp/jsData.json
+++ b/nezha-fronted/src/components/chart/panelTemp/jsData.json
@@ -1,60 +0,0 @@
-{
-  "data": [
-    "panelTemp/js/vue.js",
-    "panelTemp/js/echarts.js",
-    "panelTemp/js/httpVueLoader.js",
-    "chart.vue",
-    "chartDetail.vue",
-    "chartFormat.js",
-    "chartHeader.vue",
-    "chartHeaderMixin.js",
-    "chartList.vue",
-    "chartMixin.js",
-    "ChartScreenHeader.vue",
-    "defaultLineData.js",
-    "defaultLogData.js",
-    "defaultTableData.js",
-    "logsData.js",
-    "panelChart.vue",
-    "tempGroup.js",
-    "chart/chartAssetInfo.vue",
-    "chart/chartAutotopology.vue",
-    "chart/chartBar.vue",
-    "chart/chartClock.vue",
-    "chart/chartDiagram.vue",
-    "chart/chartEndpointInfo.vue",
-    "chart/chartGauge.vue",
-    "chart/chartGroup.vue",
-    "chart/chartHexagonD3.vue",
-    "chart/chartLog.vue",
-    "chart/chartMap.vue",
-    "chart/chartNoData.vue",
-    "chart/chartPie.vue",
-    "chart/chartStat.vue",
-    "chart/chartTable.vue",
-    "chart/chartText.vue",
-    "chart/chartTimeSeries.vue",
-    "chart/chartTopology.vue",
-    "chart/chartTreemap.vue",
-    "chart/chartUrl.vue",
-    "chart/legend.vue",
-    "chart/tools.js",
-    "chart/grid/aspectRatio.js",
-    "chart/grid/CustomDragElement.vue",
-    "chart/grid/DOM.js",
-    "chart/grid/draggableUtils.js",
-    "chart/grid/GridItem.vue",
-    "chart/grid/GridLayout.vue",
-    "chart/grid/index.js",
-    "chart/grid/responsiveUtils.js",
-    "chart/grid/TestElement.vue",
-    "chart/grid/utils.js",
-    "chart/options/chartBar.js",
-    "chart/options/chartClock.js",
-    "chart/options/chartGauge.js",
-    "chart/options/chartHexagonD3.js",
-    "chart/options/chartPie.js",
-    "chart/options/chartTimeSeries.js",
-    "chart/options/chartTreemap.js"
-  ]
-}
--- a/nezha-fronted/src/components/common/project/topoData.js
+++ b/nezha-fronted/src/components/common/project/topoData.js
--- a/nezha-fronted/src/components/page/dashboard/panel.vue
+++ b/nezha-fronted/src/components/page/dashboard/panel.vue
--- a/nezha-fronted/src/entrance/entrance.main.js
+++ b/nezha-fronted/src/entrance/entrance.main.js
@@ -0,0 +1,161 @@
+// import '@/assets/stylus/index.scss'
+// import 'element-ui/lib/theme-chalk/index.css'
+import 'xterm/dist/xterm.css'
+import '@/assets/css/main.scss'
+import '@/assets/css/font/iconfont.js'
+import ElementUI from 'element-ui'
+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 VueResource from 'vue-resource'
+import axios from 'axios'
+import { hasPermission, hasButton } 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'
+
+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)
+
+Vue.prototype.$axios = axios
+Vue.prototype.$post = post
+Vue.prototype.$get = get
+Vue.prototype.$put = put
+Vue.prototype.$delete = del
+Vue.prototype.$loadsh = loadsh
+Vue.prototype.$CONSTANTS = constants
+Vue.prototype.$TOOLS = tools
+Vue.prototype.$bottomBoxWindow = bottomBoxWindow // 底部上滑框控制
+Vue.prototype.$stringTimeParseToUnix = stringTimeParseToUnix
+Vue.prototype.$unixTimeParseToString = unixTimeParseToString
+Vue.prototype.$chartResizeTool = chartResizeTool
+Vue.prototype.$tableSet = tableSet
+Vue.prototype.$tableHeight = { // 列表页表格的高度
+  normal: 'calc(100% - 48px)', // 常规高度，特例在下方定义
+  assetList: 'calc(100% - 57px)',
+  profile: 'calc(100% - 78px)',
+  openSubList: { // 打开二级列表后的高度
+    mainList: 'calc(100% - 60px)',
+    subList: 'calc(100% - 25px)',
+    subListFromAsset: 'calc(100% - 45px)',
+    toTopBtnTop: 'calc(50% - 11px)'
+  },
+  toTopBtnTop: 'calc(100% - 73px)',
+  noPagination: 'calc(100% - 60px)' // 特例：没有翻页组件
+}
+
+Vue.mixin({
+  data: function () {
+    return {
+      prevent_opt: {
+        save: false,
+        import: false,
+        duplicate: false,
+        delete: false,
+        refresh: false,
+        query: false
+      }
+    }
+  },
+  computed: {
+    timeFormatMain () {
+      return this.$store.getters.getTimeFormatMain
+    },
+    getMenuList () {
+      return this.$store.state.user.menuList
+    },
+    getButtonList () {
+      return this.$store.state.buttonList
+    },
+    $routePath () {
+      return this.$route.path
+    }
+  },
+  ...mainMixin
+})
+
+Vue.config.productionTip = false
+Vue.use(ElementUI)
+Vue.use(Vuex)
+Vue.use(VueResource)
+Vue.use(plTable)
+Vue.component('el-select', MyElSelect)
+Vue.use(hasPermission)
+
+/* 指令 */
+Vue.directive('cancel', cancelWithChange)
+Vue.directive('clickoutside', clickoutside)
+Vue.directive('myLoading', myLoading)
+window.resizing = false
+window.vm = new Vue({
+  el: '#entrance',
+  router,
+  i18n,
+  store,
+  components: { App },
+  template: '<App/>',
+  mounted () {
+    // store.commit()
+  }
+})
+
+export default window.vm
+
+const orignalSetItem = localStorage.setItem
+localStorage.setItem = function (key, value) {
+  const setItemEvent = new Event('setItemEvent')
+  setItemEvent.key = key
+  setItemEvent.value = value
+  window.dispatchEvent(setItemEvent)
+  orignalSetItem.apply(this, arguments)
+}
+
+/* 重写组件内容 */
+/* const elUi = require("element-ui");
+const pl = require("pl-table");
+//去掉el-table表头右侧的滚动条预留空间
+elUi.Table.components.TableHeader.computed.hasGutter = () => {return false;};
+pl.PlTable.components.ElTable.components.TableHeader.computed.hasGutter = () => {return false;}; */
--- a/nezha-fronted/src/entrance/entrance.router.js
+++ b/nezha-fronted/src/entrance/entrance.router.js
@@ -0,0 +1,21 @@
+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/entrance.vue
+++ b/nezha-fronted/src/entrance/entrance.vue
--- a/nezha-fronted/src/permission.js
+++ b/nezha-fronted/src/permission.js
@@ -10,166 +10,166 @@ Vue.use(VueResource)

 const loginWhiteList = ['/setup', '/sys/license/upload', '/sys/license/state', '/sys/appearance', '/i18n'] // 免登陆白名单
 const permissionWhiteList = ['/profile', '/menu', ...loginWhiteList] // 权限白名单
-router.beforeEach((to, from, next) => {
-  if (store.getters.getNowPath !== to.path && store.getters.getNowPath !== '/login') {
-    requestsArr.forEach(xhr => xhr.cancel())
-  }
-  store.commit('setNowPath', to.path)
-  const configUrl = 'static/config.json?Timestamp=' + new Date().getTime()
-  if (to.path === '/login') { // 拦截登录页面，现货区外观设置 再系统初始化检查
-    Vue.http.get(configUrl).then(config => {
-      const appearance = new Promise(resolve => {
-        get(config.body.baseUrl + 'sys/appearance').then(res => {
-          if (res.code === 200) {
-            localStorage.setItem('nz-sys-name', res.data.system_name || '')
-            localStorage.setItem('nz-sys-logo', res.data.system_logo || '')
-            localStorage.setItem('nz-sys-favicon', res.data.system_favicon || '')
-            localStorage.setItem('nz-language', res.data.language || '')
-            store.commit('setLanguage', res.data.language)
-            localStorage.setItem('nz-sys-timezone', res.data.timezone || '')
-            localStorage.setItem('nz-sys-bgImg', res.data.system_bgImg || '')
-            localStorage.setItem('nz-default-theme', res.data.theme || '')
-            localStorage.setItem('nz-default-dateFormat', res.data.dateFormat || '')
-            changeFavicon(res.data.system_favicon)
-          }
-          resolve()
-        })
-      })
-      appearance.then(() => {
-        get(config.body.baseUrl + 'setup/inited').then(res => {
-          if (res.code === 200) {
-            if (res.inited === 0) {
-              next({ path: '/setup' })
-            } else {
-              if (localStorage.getItem('nz-token')) {
-                post('/sys/user/permissions', { token: localStorage.getItem('nz-token') }).then(res => {
-                  if (res.code === 200) {
-                    const menuList = sortByOrderNum(res.data.menus)
-                    store.commit('setMenuList', menuList)
-                    const arr = []
-                    returnMenuCode(menuList, arr)
-                    store.commit('setButtonList', arr)
-                    store.commit('setRoleList', res.data.roles)
-                    bus.$emit('login')
-                    const path = []
-                    if (menuList) {
-                      menuList.forEach(e => {
-                        if (e.route) {
-                          path.push(e.route)
-                        } else {
-                          if (e.children) {
-                            e.children.forEach(e => {
-                              if (e.route) {
-                                path.push(e.route)
-                              } else {
-                                if (e.children) {
-                                  e.children.forEach(e => {
-                                    if (e.route) {
-                                      path.push(e.route)
-                                    }
-                                  })
-                                }
-                              }
-                            })
-                          }
-                        }
-                      })
-                    }
-                    router.push({
-                      path: path[0],
-                      query: {
-                        t: +new Date()
-                      }
-                    })
-                  } else {
-                    localStorage.setItem('nz-token', '')
-                    next()
-                  }
-                })
-              } else {
-                next()
-              }
-            }
-          }
-        })
-        if (!store.getters.i18nIsReady) {
-          get(config.body.baseUrl + 'sys/i18n/lang').then(res => {
-            if (res.code === 200) {
-              loadI18n(res.data)
-              store.commit('i18nReady', true)
-            }
-          })
-        }
-      })
-    })
-  } else if (localStorage.getItem('nz-token')) {
-    const i18nRequest = new Promise(resolve => {
-      // 从localStorage加载i18n
-      if (!store.getters.i18nIsReady) {
-        const langList = localStorage.getItem('nz-language-list')
-        if (langList) {
-          store.commit('setLangList', JSON.parse(langList))
-        }
-        Vue.http.get(configUrl).then(config => {
-          get(config.body.baseUrl + 'sys/i18n/lang').then(response => {
-            if (response.code === 200) {
-              loadI18n(response.data)
-              store.commit('i18nReady', true)
-              resolve()
-            }
-          })
-        })
-      } else {
-        resolve()
-      }
-    })
-    const permissionRequest = new Promise(resolve => {
-      if (store.getters.menuList.length === 0) {
-        Vue.http.get(configUrl).then(config => {
-          post(config.body.baseUrl + 'sys/user/permissions', { token: localStorage.getItem('nz-token') }).then(res => {
-            if (res.code === 200) {
-              store.commit('setMenuList', sortByOrderNum(res.data.menus))
-              const arr = []
-              returnMenuCode(res.data.menus, arr)
-              store.commit('setButtonList', arr)
-              store.commit('setRoleList', res.data.roles)
-              const theme = localStorage.getItem(`nz-user-${localStorage.getItem('nz-user-id')}-theme`) || 'light'
-              document.getElementsByTagName('body')[0].setAttribute('class', 'theme-' + theme)
-              resolve()
-            } else {
-              localStorage.removeItem('nz-token')
-              next({ path: '/login' })
-            }
-          })
-        })
-      } else {
-        const theme = localStorage.getItem(`nz-user-${localStorage.getItem('nz-user-id')}-theme`) || 'light'
-        document.getElementsByTagName('body')[0].setAttribute('class', 'theme-' + theme)
-        resolve()
-      }
-    })
-    Promise.all([i18nRequest, permissionRequest]).then(response => {
-      if (to.path) {
-        if (permissionWhiteList.indexOf(to.path) !== -1) {
-          next()
-        } else if (hasMenu(store.getters.menuList, to.path)) {
-          next()
-        } else {
-          if (to.path === '/monitor/monitor/project' || to.path === '/monitor/monitor/module' || to.path === '/monitor/monitor/endpoint') {
-            return
-          }
-          ElementUI.Message.error(i18n.t('tip.noAccess'))
-        }
-      }
-    })
-  } else {
-    if (loginWhiteList.indexOf(to.path) !== -1) {
-      next()
-    } else {
-      next({ path: '/login' })
-    }
-  }
-})
+// router.beforeEach((to, from, next) => {
+//   if (store.getters.getNowPath !== to.path && store.getters.getNowPath !== '/login') {
+//     requestsArr.forEach(xhr => xhr.cancel())
+//   }
+//   store.commit('setNowPath', to.path)
+//   const configUrl = 'static/config.json?Timestamp=' + new Date().getTime()
+//   if (to.path === '/login') { // 拦截登录页面，现货区外观设置 再系统初始化检查
+//     Vue.http.get(configUrl).then(config => {
+//       const appearance = new Promise(resolve => {
+//         get(config.body.baseUrl + 'sys/appearance').then(res => {
+//           if (res.code === 200) {
+//             localStorage.setItem('nz-sys-name', res.data.system_name || '')
+//             localStorage.setItem('nz-sys-logo', res.data.system_logo || '')
+//             localStorage.setItem('nz-sys-favicon', res.data.system_favicon || '')
+//             localStorage.setItem('nz-language', res.data.language || '')
+//             store.commit('setLanguage', res.data.language)
+//             localStorage.setItem('nz-sys-timezone', res.data.timezone || '')
+//             localStorage.setItem('nz-sys-bgImg', res.data.system_bgImg || '')
+//             localStorage.setItem('nz-default-theme', res.data.theme || '')
+//             localStorage.setItem('nz-default-dateFormat', res.data.dateFormat || '')
+//             changeFavicon(res.data.system_favicon)
+//           }
+//           resolve()
+//         })
+//       })
+//       appearance.then(() => {
+//         get(config.body.baseUrl + 'setup/inited').then(res => {
+//           if (res.code === 200) {
+//             if (res.inited === 0) {
+//               next({ path: '/setup' })
+//             } else {
+//               if (localStorage.getItem('nz-token')) {
+//                 post('/sys/user/permissions', { token: localStorage.getItem('nz-token') }).then(res => {
+//                   if (res.code === 200) {
+//                     const menuList = sortByOrderNum(res.data.menus)
+//                     store.commit('setMenuList', menuList)
+//                     const arr = []
+//                     returnMenuCode(menuList, arr)
+//                     store.commit('setButtonList', arr)
+//                     store.commit('setRoleList', res.data.roles)
+//                     bus.$emit('login')
+//                     const path = []
+//                     if (menuList) {
+//                       menuList.forEach(e => {
+//                         if (e.route) {
+//                           path.push(e.route)
+//                         } else {
+//                           if (e.children) {
+//                             e.children.forEach(e => {
+//                               if (e.route) {
+//                                 path.push(e.route)
+//                               } else {
+//                                 if (e.children) {
+//                                   e.children.forEach(e => {
+//                                     if (e.route) {
+//                                       path.push(e.route)
+//                                     }
+//                                   })
+//                                 }
+//                               }
+//                             })
+//                           }
+//                         }
+//                       })
+//                     }
+//                     router.push({
+//                       path: path[0],
+//                       query: {
+//                         t: +new Date()
+//                       }
+//                     })
+//                   } else {
+//                     localStorage.setItem('nz-token', '')
+//                     next()
+//                   }
+//                 })
+//               } else {
+//                 next()
+//               }
+//             }
+//           }
+//         })
+//         if (!store.getters.i18nIsReady) {
+//           get(config.body.baseUrl + 'sys/i18n/lang').then(res => {
+//             if (res.code === 200) {
+//               loadI18n(res.data)
+//               store.commit('i18nReady', true)
+//             }
+//           })
+//         }
+//       })
+//     })
+//   } else if (localStorage.getItem('nz-token')) {
+//     const i18nRequest = new Promise(resolve => {
+//       // 从localStorage加载i18n
+//       if (!store.getters.i18nIsReady) {
+//         const langList = localStorage.getItem('nz-language-list')
+//         if (langList) {
+//           store.commit('setLangList', JSON.parse(langList))
+//         }
+//         Vue.http.get(configUrl).then(config => {
+//           get(config.body.baseUrl + 'sys/i18n/lang').then(response => {
+//             if (response.code === 200) {
+//               loadI18n(response.data)
+//               store.commit('i18nReady', true)
+//               resolve()
+//             }
+//           })
+//         })
+//       } else {
+//         resolve()
+//       }
+//     })
+//     const permissionRequest = new Promise(resolve => {
+//       if (store.getters.menuList.length === 0) {
+//         Vue.http.get(configUrl).then(config => {
+//           post(config.body.baseUrl + 'sys/user/permissions', { token: localStorage.getItem('nz-token') }).then(res => {
+//             if (res.code === 200) {
+//               store.commit('setMenuList', sortByOrderNum(res.data.menus))
+//               const arr = []
+//               returnMenuCode(res.data.menus, arr)
+//               store.commit('setButtonList', arr)
+//               store.commit('setRoleList', res.data.roles)
+//               const theme = localStorage.getItem(`nz-user-${localStorage.getItem('nz-user-id')}-theme`) || 'light'
+//               document.getElementsByTagName('body')[0].setAttribute('class', 'theme-' + theme)
+//               resolve()
+//             } else {
+//               localStorage.removeItem('nz-token')
+//               next({ path: '/login' })
+//             }
+//           })
+//         })
+//       } else {
+//         const theme = localStorage.getItem(`nz-user-${localStorage.getItem('nz-user-id')}-theme`) || 'light'
+//         document.getElementsByTagName('body')[0].setAttribute('class', 'theme-' + theme)
+//         resolve()
+//       }
+//     })
+//     Promise.all([i18nRequest, permissionRequest]).then(response => {
+//       if (to.path) {
+//         if (permissionWhiteList.indexOf(to.path) !== -1) {
+//           next()
+//         } else if (hasMenu(store.getters.menuList, to.path)) {
+//           next()
+//         } else {
+//           if (to.path === '/monitor/monitor/project' || to.path === '/monitor/monitor/module' || to.path === '/monitor/monitor/endpoint') {
+//             return
+//           }
+//           ElementUI.Message.error(i18n.t('tip.noAccess'))
+//         }
+//       }
+//     })
+//   } else {
+//     if (loginWhiteList.indexOf(to.path) !== -1) {
+//       next()
+//     } else {
+//       next({ path: '/login' })
+//     }
+//   }
+// })
 router.afterEach((to, from) => {
  // store.commit('setNowPath', '')
 })
--- a/nezha-fronted/src/router/index.js
+++ b/nezha-fronted/src/router/index.js
@@ -2,7 +2,7 @@ import Vue from 'vue'
 import Router from 'vue-router'

 Vue.use(Router)
-
+console.log('app.router')
 export default new Router({
  routes: [
    {
--- a/nezha-fronted/src/ts.html
+++ b/nezha-fronted/src/ts.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Title</title>
+</head>
+<body>
+
+</body>
+</html>
+<script>
+  const nums = 34567
+function sun () {
+    let flag = true
+
+}
+</script>