update

icarusion · icarusion · commit c42ec3467d0e · 2017-04-01T15:33:15.000+08:00
diff --git a/demo/LICENSE b/demo/LICENSE
diff --git a/demo/app.vue b/demo/app.vue
@@ -2,6 +2,9 @@
     <div>
         <v-title title="Vue组件化"></v-title>
         <v-button @click="handleClick">点击按钮</v-button>
+        <p>
+            <img src="./images/image.png" style="width: 200px;">
+        </p>
     </div>
 </template>
 <script>
diff --git a/demo/images/image.png b/demo/images/image.png
diff --git a/demo/index.ejs b/demo/index.ejs
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <title>Webpack App</title>
+    <link rel="stylesheet" href="<%= htmlWebpackPlugin.files.css[0] %>">
+</head>
+<body>
+    <div id="app"></div>
+    <script type="text/javascript" src="<%= htmlWebpackPlugin.files.js[0] %>"></script>
+</body>
+</html> 
diff --git a/demo/package.json b/demo/package.json
@@ -5,7 +5,8 @@
   "main": "index.js",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
-    "dev": "webpack-dev-server --open --config webpack.config.js"
+    "dev": "webpack-dev-server --open --config webpack.config.js",
+    "build": "webpack --progress --hide-modules --config webpack.prod.config.js"
   },
   "author": "",
   "license": "ISC",
@@ -18,13 +19,17 @@
     "babel-runtime": "^6.23.0",
     "css-loader": "^0.27.3",
     "extract-text-webpack-plugin": "^2.1.0",
+    "file-loader": "^0.10.1",
+    "html-webpack-plugin": "^2.28.0",
     "style-loader": "^0.16.1",
+    "url-loader": "^0.5.8",
     "vue-hot-reload-api": "^2.0.11",
     "vue-loader": "^11.3.4",
     "vue-style-loader": "^2.0.5",
     "vue-template-compiler": "^2.2.6",
     "webpack": "^2.3.2",
-    "webpack-dev-server": "^2.4.2"
+    "webpack-dev-server": "^2.4.2",
+    "webpack-merge": "^4.1.0"
   },
   "dependencies": {
     "vue": "^2.2.6"
diff --git a/demo/webpack.config.js b/demo/webpack.config.js
@@ -18,8 +18,8 @@ var config = {
                 options: {
                     loaders: {
                         css: ExtractTextPlugin.extract({
-                          use: 'css-loader',
-                          fallback: 'vue-style-loader'
+                            use: 'css-loader',
+                            fallback: 'vue-style-loader'
                         })
                     }
                 }
@@ -35,6 +35,10 @@ var config = {
                     use: 'css-loader',
                     fallback: 'style-loader'
                 })
+            },
+            {
+                test: /\.(gif|jpg|png|woff|svg|eot|ttf)\??.*$/,
+                loader: 'url-loader?limit=1024'
             }
         ]
     },
diff --git a/demo/webpack.prod.config.js b/demo/webpack.prod.config.js
@@ -0,0 +1,41 @@
+var webpack = require('webpack');
+var HtmlWebpackPlugin = require('html-webpack-plugin');
+var ExtractTextPlugin = require('extract-text-webpack-plugin');
+var merge = require('webpack-merge');
+var webpackBaseConfig = require('./webpack.config.js');
+
+// 清空基本配置的插件列表
+webpackBaseConfig.plugins = [];
+
+module.exports = merge(webpackBaseConfig, {
+    output: {
+        publicPath: '/dist/',
+        // 将入口文件重命名为带有 20 位 hash 值的唯一文件
+        filename: '[name].[hash].js'
+    },
+    plugins: [
+        new ExtractTextPlugin({
+            // 提取 css，并重命名为带有 20 位 hash 值的唯一文件
+            filename: '[name].[hash].css',
+            allChunks: true
+        }),
+        // 定义当前 node 环境为生产环境
+        new webpack.DefinePlugin({
+            'process.env': {
+                NODE_ENV: '"production"'
+            }
+        }),
+        // 压缩 js
+        new webpack.optimize.UglifyJsPlugin({
+            compress: {
+                warnings: false
+            }
+        }),
+        // 提取模板，并保存入口 html 文件
+        new HtmlWebpackPlugin({
+            filename: '../index_prod.html',
+            template: './index.ejs',
+            inject: false
+        })
+    ]
+});

Original file line number	Diff line number	Diff line change
`@@ -18,8 +18,8 @@ var config = {`
`18`	`18`	`options: {`
`19`	`19`	`loaders: {`
`20`	`20`	`css: ExtractTextPlugin.extract({`
`21`		`- use: 'css-loader',`
`22`		`- fallback: 'vue-style-loader'`
	`21`	`+ use: 'css-loader',`
	`22`	`+ fallback: 'vue-style-loader'`
`23`	`23`	`})`
`24`	`24`	`}`
`25`	`25`	`}`
`@@ -35,6 +35,10 @@ var config = {`
`35`	`35`	`use: 'css-loader',`
`36`	`36`	`fallback: 'style-loader'`
`37`	`37`	`})`
	`38`	`+ },`
	`39`	`+ {`
	`40`	`+ test: /\.(gif\|jpg\|png\|woff\|svg\|eot\|ttf)\??.*$/,`
	`41`	`+ loader: 'url-loader?limit=1024'`
`38`	`42`	`}`
`39`	`43`	`]`
`40`	`44`	`},`