node版本说明：about.md

不适用pug

template/.eslintignore

@@ -1,3 +1,5 @@
 core/*.js
-core/*/*.js
+core/**/*.js
 build/*.js
+
+src/**/*.*

template/.eslintrc.js

@@ -20,12 +20,13 @@ module.exports = {
         'html'
     ],
     // add your custom rules here
-  'rules': {
+    rules: {
         // allow paren-less arrow functions
         'arrow-parens': 0,
         // allow async-await
         'generator-star-spacing': 0,
         // allow debugger during development
-    'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0
+        'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
+        'indent': ['error', 'tab'],
     }
 }

template/About.md

@@ -0,0 +1,21 @@
+### 特别注意: 
+项目使用的node版本为8.+,否则会遇到这个问题:
+
+https://github.com/YuraDev/vue-chrome-extension-template/issues/19
+
+我使用的是8.4.0
+## 怎么切换node版本
+`mac`
+> 安装`n`扩展包: sudo npm i n -g
+![](../docs/about/7f59e923.png)
+
+> 安装指定版本node: sudo n 8.4.0
+![](../docs/about/6db62665.png)
+
+> 切换版本: sudo n
+![](../docs/about/bc372062.png)
+
+> 验证node版本: node -v
+![](../docs/about/098511ee.png)
+`win`
+- 补充...

template/package.json

@@ -18,6 +18,7 @@
   "scripts": {
     "lint": "eslint --ext .js,.vue src",
     "dev": "webpack --config ./core/webpack.dev.js --hide-modules",
+    "dev-info": "webpack --config ./core/webpack.dev.js",
     "build": "webpack --config ./core/webpack.prod.js -p --progress  --hide-modules --colors"
   },
   "devDependencies": {
@@ -31,7 +32,7 @@
     "babel-register": "^6.26.0",
     "buble": "^0.16.0",
     "buble-loader": "^0.4.1",
-    "clean-webpack-plugin": "^0.1.17",
+    "clean-webpack-plugin": "^0.1.19",
     "copy-webpack-plugin": "^4.2.0",
     "cross-env": "^5.1.0",
     "css-loader": "^0.28.7",

template/src/devtools/panel.js

@@ -1,5 +1,6 @@
 import Vue from 'vue'
 import root from './root.vue'
+
 Vue.config.productionTip = false
 /* eslint-disable no-new */
 new Vue({

template/src/devtools/root.vue

@@ -3,12 +3,13 @@
 </template>
 <script>
     export default {
-    data: () => ({
+        data: () => ({}),
-    }),
+        computed: {},
-    computed: { },
+        created() {
-    created () { },
+        },
-    mounted () { },
+        mounted() {
-    methods: { }
+        },
+        methods: {}
     }
 </script>
 <style lang="scss">

template/src/manifest.js

@@ -1,11 +1,10 @@
-
 module.exports = {
     name: 'Vue Extension',
     version: '1.0.0',
     description: 'Vue.js Chrome Extension Template (wcer)',
     author: 'yura',
     manifest_version: 2,
-  icons: { '16': 'icons/16.png', '128': 'icons/128.png' },
+    icons: {'16': 'icons/16.png', '128': 'icons/128.png'},
     permissions: [
         '<all_urls>',
         '*://*/*',
@@ -31,11 +30,11 @@ module.exports = {
     devtools_page: 'pages/devtools.html',
     options_page: 'pages/options.html',
     content_scripts: [{
-    js: [ 'js/inject.js' ],
+        js: ['js/inject.js'],
         run_at: 'document_end',
         matches: ['<all_urls>'],
         all_frames: true
     }],
     content_security_policy: "script-src 'self' 'unsafe-eval'; object-src 'self'",
-  web_accessible_resources: [ 'panel.html', 'js/content.js' ]
+    web_accessible_resources: ['panel.html', 'js/content.js']
 }

template/src/options/index.js

@@ -1,5 +1,6 @@
 import Vue from 'vue'
 import root from './root.vue'
+
 Vue.config.productionTip = false
 /* eslint-disable no-new */
 new Vue({

template/src/options/root.vue

@@ -3,12 +3,13 @@
 </template>
 <script>
     export default {
-    data: () => ({
+        data: () => ({}),
-    }),
+        computed: {},
-    computed: { },
+        created() {
-    created () { },
+        },
-    mounted () { },
+        mounted() {
-    methods: { }
+        },
+        methods: {}
     }
 </script>
 <style>

template/src/popup/root.vue

@@ -1,17 +1,20 @@
-<template lang="pug">
+<template>
-    div
+    <div>
-      el-button(type="primary" @click="tab") New tab 
+        666
+        <el-button type="primary" @click="tab">test</el-button>
+    </div>
 </template>
 <script>
     export default {
-    data: () => ({
+        data: () => ({}),
-    }),
+        computed: {},
-    computed: { },
+        created() {
-    created () { },
+        },
-    mounted () { },
+        mounted() {
+        },
         methods: {
-      tab () {
+            tab() {
-        chrome.tabs.create({ url: 'pages/app.html' })
+                chrome.tabs.create({url: 'pages/app.html'})
             }
         }
     }

template/src/tab/index.js

@@ -1,5 +1,6 @@
 import Vue from 'vue'
 import root from './root.vue'
+
 Vue.config.productionTip = false
 /* eslint-disable no-new */
 new Vue({

template/src/tab/root.vue

@@ -1,14 +1,20 @@
 <template lang="pug">
-    div tab
+    <div>
+    <button>222</button>
+
+
+    </div>
+
 </template>
 <script>
     export default {
-    data: () => ({
+        data: () => ({}),
-    }),
+        computed: {},
-    computed: { },
+        created() {
-    created () { },
+        },
-    mounted () { },
+        mounted() {
-    methods: { }
+        },
+        methods: {}
     }
 </script>
 <style lang="scss">