step one and two

brandonxiang · brandonxiang · commit b580066dbd75 · 2016-07-22T13:02:47.000+08:00
diff --git a/.babelrc b/.babelrc
@@ -1,5 +1,4 @@
 {
-  "presets": ["es2015", "stage-2"],
-  "plugins": ["transform-runtime"],
-  "comments": false
+ "presets": ["es2015", "stage-0"],
+ "plugins": ["transform-runtime"]
 }
diff --git a/index.html b/index.html
@@ -2,10 +2,10 @@
 <html lang="en">
   <head>
     <meta charset="utf-8">
-    <title>test-vue-webpack</title>
+    <title>Vue Example</title>
   </head>
   <body>
-    <app></app>
+      <h3>{{ message }}</h3>
     <script src="dist/build.js"></script>
   </body>
 </html>
diff --git a/package.json b/package.json
@@ -1,33 +1,35 @@
 {
   "name": "test-vue-webpack",
+  "version": "1.0.0",
   "description": "A Vue.js project",
-  "author": "brandonxiang",
-  "private": true,
+  "main": "src/main.js",
   "scripts": {
-    "dev": "webpack-dev-server --inline --hot",
-    "build": "cross-env NODE_ENV=production webpack --progress --hide-modules"
+    "test": "echo \"Error: no test specified\" && exit 1"
   },
-  "dependencies": {
-    "babel-runtime": "^5.8.0",
-    "leaflet": "^0.7.7",
-    "vue": "^1.0.0"
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/brandonxiang/example-vue-webpack.git"
+  },
+  "keywords": [
+    "vue",
+    "webpack"
+  ],
+  "author": "brandonxiang",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/brandonxiang/example-vue-webpack/issues"
   },
+  "homepage": "https://github.com/brandonxiang/example-vue-webpack#readme",
   "devDependencies": {
-    "babel-core": "^6.0.0",
-    "babel-loader": "^6.0.0",
-    "babel-plugin-transform-runtime": "^6.0.0",
-    "babel-preset-es2015": "^6.0.0",
-    "babel-preset-stage-2": "^6.0.0",
-    "cross-env": "^1.0.6",
-    "css-loader": "^0.23.0",
-    "file-loader": "^0.8.4",
-    "json-loader": "^0.5.4",
-    "url-loader": "^0.5.7",
-    "vue-hot-reload-api": "^1.2.0",
-    "vue-html-loader": "^1.0.0",
-    "vue-loader": "^8.2.1",
-    "vue-style-loader": "^1.0.0",
-    "webpack": "^1.12.2",
-    "webpack-dev-server": "^1.12.0"
+    "babel-core": "^6.1.2",
+    "babel-loader": "^6.1.0",
+    "babel-plugin-transform-runtime": "^6.1.2",
+    "babel-preset-es2015": "^6.1.2",
+    "babel-preset-stage-0": "^6.1.2",
+    "babel-runtime": "^5.8.0",
+    "webpack": "^1.12.2"
+  },
+  "dependencies": {
+    "vue": "^1.0.26"
   }
 }
diff --git a/src/App.vue b/src/App.vue
diff --git a/src/leaflet.vue b/src/leaflet.vue
diff --git a/src/main.js b/src/main.js
@@ -1,7 +1,8 @@
-import Vue from 'vue';
-import App from './App.vue';
+import Vue from 'vue'
 
-var example1 = new Vue({
+new Vue({
   el: 'body',
-  components: { App }
-});
+  data: {
+      message: "Hello Vue"
+  }
+})
diff --git a/webpack.config.js b/webpack.config.js
@@ -1,66 +1,24 @@
-var path = require('path')
-var webpack = require('webpack')
-
 module.exports = {
+  // 这是一个主文件包括其他模块
   entry: './src/main.js',
+  // 编译的文件路径
   output: {
-    path: path.resolve(__dirname, './dist'),
-    publicPath: '/dist/',
+      //`dist`文件夹
+    path: './dist',
+    // 文件 `build.js` 即 dist/build.js
     filename: 'build.js'
   },
-  resolveLoader: {
-    root: path.join(__dirname, 'node_modules'),
-  },
   module: {
+    // 一些特定的编译规则
     loaders: [
       {
-        test: /\.vue$/,
-        loader: 'vue'
-      },
-      {
+        // 让webpack去验证文件是否是.js结尾将其转换
         test: /\.js$/,
+        // 通过babel转换
         loader: 'babel',
+        // 不用转换的node_modules文件夹
         exclude: /node_modules/
-      },
-      {
-        test: /\.json$/,
-        loader: 'json'
-      },
-      {
-        test: /\.html$/,
-        loader: 'vue-html'
-      },
-      {
-        test: /\.(png|jpg|gif|svg)$/,
-        loader: 'url',
-        query: {
-          limit: 10000,
-          name: '[name].[ext]?[hash]'
-        }
       }
     ]
-  },
-  devServer: {
-    historyApiFallback: true,
-    noInfo: true
-  },
-  devtool: '#eval-source-map'
-}
-
-if (process.env.NODE_ENV === 'production') {
-  module.exports.devtool = '#source-map'
-  // http://vuejs.github.io/vue-loader/workflow/production.html
-  module.exports.plugins = (module.exports.plugins || []).concat([
-    new webpack.DefinePlugin({
-      'process.env': {
-        NODE_ENV: '"production"'
-      }
-    }),
-    new webpack.optimize.UglifyJsPlugin({
-      compress: {
-        warnings: false
-      }
-    }),
-    new webpack.optimize.OccurenceOrderPlugin()
-  ])
+  }
 }

Original file line number	Diff line number	Diff line change
`@@ -1,5 +1,4 @@`
`1`	`1`	`{`
`2`		`- "presets": ["es2015", "stage-2"],`
`3`		`- "plugins": ["transform-runtime"],`
`4`		`- "comments": false`
	`2`	`+ "presets": ["es2015", "stage-0"],`
	`3`	`+ "plugins": ["transform-runtime"]`
`5`	`4`	`}`