基于template做代码结构调整

2026-06-17 03:16:46 +00:00 · 2019-03-15 19:10:02 +08:00
parent 4e808384fe
commit 9579ed24d2
42 changed files with 68714 additions and 2085 deletions
@@ -10,7 +10,9 @@
    "dev-index": "cross-env NODE_ENV=development webpack-dev-server --open http://localhost:8082/index.html --inline  --progress --hot --port 8082",
    "dev-popup": "cross-env NODE_ENV=development webpack-dev-server --open http://localhost:8083/popup.html --inline  --progress --hot --port 8083",
    "dev-inspector": "cross-env NODE_ENV=development webpack-dev-server --open http://localhost:8084/devInspector.html --inline --progress --hot --port 8084",
-    "build": "cross-env NODE_ENV=production webpack --progress --hide-modules"
+    "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
+
+    "build2": "webpack --config ./src/webpack.config.js --progress"
  },
  "dependencies": {
    "fs": "0.0.1-security",
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>popup</title>
+</head>
+<body>
+  <div id="app"></div>
+<script type="text/javascript" src="/js/popup.js?bda05936787919286d9e"></script></body>
+</html>
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title><%= htmlWebpackPlugin.options.title %></title>
+</head>
+<body>
+  <div id="app"></div>
+</body>
+</html>
@@ -0,0 +1,17 @@
+const path = require('path')
+const HtmlWebpackPlugin = require('html-webpack-plugin')
+
+module.exports = {
+  htmlPage(title, filename, chunks, template) {
+    return new HtmlWebpackPlugin({
+      title: title,
+      hash: true,
+      cache: true,
+      inject: 'body',
+      filename: './pages/' + filename + '.html',
+      template: template || path.resolve(__dirname, './page.ejs'),
+      appMountId: 'app',
+      chunks: chunks
+    });
+  }
+}
@@ -1,21 +0,0 @@
-<template>
-  <div id="app">
-    <h1>{{label}}</h1>
-  </div>
-</template>
-
-<script>
-  export default {
-    name: "app",
-    data() {
-      return {
-        label: "indexPage",
-      }
-    }
-  }
-</script>
-
-
-<style scoped>
-
-</style>
@@ -0,0 +1,47 @@
+module.exports = {
+    "name": "Cocos Creator Inspector",
+    "version": "1.0.1",
+    "description": "Cocos Creator Inspector",
+    "browser_action": {
+      "default_title": "Cocos Creator Inspector",
+      "default_icon": "static/images/icon48.png",
+      "default_popup": "popup.html"
+    },
+    "icons": {
+      "48": "static/images/icon48.png"
+    },
+    "devtools_page": "dev.html",
+    "content_scripts": [
+      {
+        "matches": [
+          "<all_urls>"
+        ],
+        "js": [
+          "contentScripts.main.js"
+        ],
+        "run_at": "document_end"
+      }
+    ],
+    "background": {
+      "scripts": [
+        "backgroundScripts.main.js"
+      ]
+    },
+    "options_page": "index.html",
+    "manifest_version": 2,
+    "permissions": [
+      "tabs",
+      "http://*/*",
+      "https://*/*",
+      "*://*/*",
+      "system.cpu",
+      "tabs",
+      "storage",
+      "nativeMessaging"
+    ],
+    "web_accessible_resources": [
+      "*/*",
+      "*"
+    ],
+    "content_security_policy": "script-src 'self' 'unsafe-eval';  object-src 'self'"
+  }
@@ -1,10 +1,11 @@
 import Vue from 'vue';
 import ElementUI from 'element-ui'
 import 'element-ui/lib/theme-chalk/index.css'
-import App from './App.vue';
+import index from './index.vue';
+
 Vue.use(ElementUI);

 new Vue({
  el: '#app',
-  render: h => h(App)
+  render: h => h(index)
 });
@@ -1,11 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="utf-8">
-  <title>vue</title>
-</head>
-<body>
-<div id="app">
-</div>
-</body>
-</html>
@@ -0,0 +1,162 @@
+let path = require('path');
+let webpack = require('webpack');
+let HtmlWebpackPlugin = require('html-webpack-plugin');
+let CleanWebpackPlugin = require('clean-webpack-plugin');
+let CopyWebpackPlugin = require('copy-webpack-plugin');
+if (process.env.NODE_ENV === 'production') {
+
+}
+
+let resolve = function (dir) {
+  return path.join(__dirname, dir);
+}
+
+let htmlPage = function (title, filename, chunks, template) {
+  return new HtmlWebpackPlugin({
+    title: title,
+    hash: true,
+    cache: true,
+    inject: 'body',
+    filename: './pages/' + filename + '.html',
+    template: template || path.resolve(__dirname, 'core/page.ejs'),
+    appMountId: 'app',
+    chunks
+  });
+}
+
+module.exports = {
+  entry: {
+    popup: resolve("popup"),
+    devtools:resolve("devtools"),
+    // devInspector: path.resolve(__dirname, './src/dev/devInspector/main.js'),
+    // dev: path.resolve(__dirname, './src/dev/dev.js'),
+    // index: path.resolve(__dirname, './src/index/main.js'),
+    // backgroundScripts: path.resolve(__dirname, './src/dev/backgroundScripts.js'),
+    // contentScripts: path.resolve(__dirname, './src/dev/contentScripts.js'),
+    // util: path.resolve(__dirname, './src/dev/util.js'),
+    // injectScript: path.resolve(__dirname, './src/dev/injectScript.js'),
+  },
+  output: {
+    path: path.resolve(__dirname, 'build'),
+    publicPath: '/',
+    filename: 'js/[name].js'
+  },
+  plugins: [
+    // new webpack.HotModuleReplacementPlugin(),
+    // webpack 执行之前删除dist下的文件
+    new CleanWebpackPlugin(['./build/*'], {
+      root: __dirname,//根目录
+      verbose: true,//开启在控制台输出信息
+      dry: false,//启用删除文件
+    }),
+
+    htmlPage("popup", 'popup', ['popup']),
+    htmlPage("devtools", 'devtools', ['devtools']),
+
+    //index.html
+    // new HtmlWebpackPlugin({
+    //   template: __dirname + "/src/index/index.html",
+    //   filename: 'index.html',
+    //   inject: 'body',
+    //   chunks: ['index']
+    // }),
+
+
+    //dev.html
+    // new HtmlWebpackPlugin({
+    //   template: __dirname + "/src/dev/dev.html",
+    //   filename: 'dev.html',
+    //   inject: 'body',
+    //   chunks: ['dev']
+    // }),
+
+    //devInspector.html
+    // new HtmlWebpackPlugin({
+    //   template: __dirname + "/src/dev/devInspector/devInspector.html",
+    //   filename: 'devInspector.html',
+    //   inject: 'body',
+    //   chunks: ['devInspector']
+    // }),
+
+    // // 拷贝静态资源(manifest.json)
+    // new CopyWebpackPlugin([
+    //   {
+    //     from: path.resolve(__dirname, 'src/assets/'),
+    //     to: 'static',
+    //     force: true,
+    //     // ignore: ['.*']
+    //   },
+    //   {
+    //     from: path.resolve(__dirname, 'src/manifest.json'),
+    //     to: path.resolve(__dirname, 'dist/')
+    //   }]),
+    // new webpack.DefinePlugin({
+    //   'process.env': {
+    //     NODE_ENV: '"production"'
+    //   }
+    // }),
+    // new webpack.optimize.UglifyJsPlugin({
+    //   sourceMap: true,
+    //   compress: {
+    //     warnings: false
+    //   }
+    // }),
+    // new webpack.LoaderOptionsPlugin({
+    //   minimize: true
+    // })
+  ],
+  module: {
+    rules: [
+      {
+        test: /\.(less|css)$/,
+        use: [
+          'vue-style-loader',
+          'css-loader'
+        ],
+      },
+      {
+        test: /\.vue$/,
+        loader: 'vue-loader',
+        options: {
+          loaders: {
+            scss: 'style-loader!css-loader!sass-loader',
+            sass: 'style-loader!css-loader!sass-loader?indentedSyntax',
+          }
+          // other vue-loader options go here
+        }
+      },
+      {
+        test: /\.js$/,
+        loader: 'babel-loader',
+        exclude: /node_modules/
+      },
+      {
+        test: /\.(png|jpg|gif|svg|ttf|woff|woff2|eot)$/,
+        loader: 'file-loader',
+        options: {
+          name: '[name].[ext]?[hash]'
+        }
+      }
+    ]
+  },
+  resolve: {
+    alias: {
+      'vue$': 'vue/dist/vue.esm.js'
+    },
+    extensions: ['*', '.js', '.vue', '.json']
+  },
+  devServer: {
+    contentBase: "./dist",//本地服务器所加载的页面所在的目录
+    historyApiFallback: true,//不跳转
+    noInfo: true,
+    inline: true,//实时刷新
+    overlay: true
+  },
+
+  performance: {
+    hints: false
+  },
+  devtool: '#source-map'
+};
+
+
@@ -1,147 +0,0 @@
-let path = require('path');
-let webpack = require('webpack');
-let HtmlWebpackPlugin = require('html-webpack-plugin');
-let CleanWebpackPlugin = require('clean-webpack-plugin');
-let CopyWebpackPlugin = require('copy-webpack-plugin');
-if (process.env.NODE_ENV === 'production') {
-
-}
-
-module.exports = {
-  entry: {
-    popup: path.resolve(__dirname, "./src/popup/main.js"),
-    devInspector: path.resolve(__dirname, './src/dev/devInspector/main.js'),
-    dev: path.resolve(__dirname, './src/dev/dev.js'),
-    index: path.resolve(__dirname, './src/index/main.js'),
-    backgroundScripts: path.resolve(__dirname, './src/dev/backgroundScripts.js'),
-    contentScripts: path.resolve(__dirname, './src/dev/contentScripts.js'),
-    util: path.resolve(__dirname, './src/dev/util.js'),
-    injectScript: path.resolve(__dirname, './src/dev/injectScript.js'),
-  },
-  output: {
-    path: path.resolve(__dirname, './dist'),
-    publicPath: '/',
-    filename: '[name].main.js'
-  },
-  plugins: [
-    new webpack.HotModuleReplacementPlugin(),
-    // webpack 执行之前删除dist下的文件
-    new CleanWebpackPlugin(
-      ['dist/*'],
-      {
-        root: __dirname,//根目录
-        verbose: true,//开启在控制台输出信息
-        dry: false,//启用删除文件
-      }),
-    //index.html
-    new HtmlWebpackPlugin({
-      template: __dirname + "/src/index/index.html",
-      filename: 'index.html',
-      inject: 'body',
-      chunks: ['index']
-    }),
-    //popup.html
-    new HtmlWebpackPlugin({
-      template: __dirname + "/src/popup/popup.html",
-      filename: 'popup.html',
-      inject: 'body',
-      chunks: ['popup']
-    }),
-    //dev.html
-    new HtmlWebpackPlugin({
-      template: __dirname + "/src/dev/dev.html",
-      filename: 'dev.html',
-      inject: 'body',
-      chunks: ['dev']
-    }),
-
-    //devInspector.html
-    new HtmlWebpackPlugin({
-      template: __dirname + "/src/dev/devInspector/devInspector.html",
-      filename: 'devInspector.html',
-      inject: 'body',
-      chunks: ['devInspector']
-    }),
-
-    // 拷贝静态资源(manifest.json)
-    new CopyWebpackPlugin([
-      {
-        from: path.resolve(__dirname, 'src/assets/'),
-        to: 'static',
-        force: true,
-        // ignore: ['.*']
-      },
-      {
-        from: path.resolve(__dirname, 'src/manifest.json'),
-        to: path.resolve(__dirname, 'dist/')
-      }]),
-    new webpack.DefinePlugin({
-      'process.env': {
-        NODE_ENV: '"production"'
-      }
-    }),
-    // new webpack.optimize.UglifyJsPlugin({
-    //   sourceMap: true,
-    //   compress: {
-    //     warnings: false
-    //   }
-    // }),
-    new webpack.LoaderOptionsPlugin({
-      minimize: true
-    })
-  ],
-  module: {
-    rules: [
-      {
-        test: /\.(less|css)$/,
-        use: [
-          'vue-style-loader',
-          'css-loader'
-        ],
-      },
-      {
-        test: /\.vue$/,
-        loader: 'vue-loader',
-        options: {
-          loaders: {
-            scss: 'style-loader!css-loader!sass-loader',
-            sass: 'style-loader!css-loader!sass-loader?indentedSyntax',
-          }
-          // other vue-loader options go here
-        }
-      },
-      {
-        test: /\.js$/,
-        loader: 'babel-loader',
-        exclude: /node_modules/
-      },
-      {
-        test: /\.(png|jpg|gif|svg|ttf|woff|woff2|eot)$/,
-        loader: 'file-loader',
-        options: {
-          name: '[name].[ext]?[hash]'
-        }
-      }
-    ]
-  },
-  resolve: {
-    alias: {
-      'vue$': 'vue/dist/vue.esm.js'
-    },
-    extensions: ['*', '.js', '.vue', '.json']
-  },
-  devServer: {
-    contentBase: "./dist",//本地服务器所加载的页面所在的目录
-    historyApiFallback: true,//不跳转
-    noInfo: true,
-    inline: true,//实时刷新
-    overlay: true
-  },
-
-  performance: {
-    hints: false
-  },
-  devtool: '#source-map'
-};
-
-