webpack config

build/webpack.build.js

@@ -1,3 +1,5 @@
+var webpack = require('webpack');
+var getPostcssPlugin = require('./utils/postcss_pipe');
 var config = require('./webpack.config.js');
 
 config.entry = {
@@ -14,6 +16,28 @@ config.externals = {
   vue: 'vue'
 };
 
+config.plugins = [
+  new webpack.DefinePlugin({
+    'process.env.NODE_ENV': '"production"'
+  }),
+  new webpack.LoaderOptionsPlugin({
+    minimize: true,
+    debug: false,
+    options: {
+      postcss: getPostcssPlugin,
+      babel: {
+        presets: ['es2015'],
+        plugins: ['transform-runtime', 'transform-vue-jsx']
+      },
+      vue: {
+        autoprefixer: false,
+        preserveWhitespace: false,
+        postcss: getPostcssPlugin
+      }
+    }
+  })
+];
+
 delete config.devtool;
 
 module.exports = config;

build/webpack.build.min.js

@@ -1,20 +1,19 @@
-var config = require('./webpack.build.js');
 var webpack = require('webpack');
+var getPostcssPlugin = require('./utils/postcss_pipe');
+var config = require('./webpack.config.js');
 
 config.output.filename = config.output.filename.replace(/\.js$/, '.min.js');
 
-config.plugins = [
+config.plugins = config.plugins.concat([
-  new webpack.LoaderOptionsPlugin({
-    minimize: true,
-    debug: false
-  }),
   new webpack.optimize.UglifyJsPlugin({
-    comments: false,
     compress: {
-      drop_console: true,
       warnings: false
-    }
+    },
+    output: {
+      comments: false
+    },
+    sourceMap: false
   })
-];
+]);
 
 module.exports = config;

build/webpack.components.js

@@ -1,6 +1,6 @@
 var path = require('path');
 var Components = require('../components.json');
-var config = require('./webpack.config.js');
+var config = require('./webpack.build.js');
 
 delete config.devtool;
 

build/webpack.config.js

@@ -8,6 +8,14 @@ var version = require('../package.json').version;
 var getPoastcssPlugin = require('./utils/postcss_pipe');
 var ProgressBarPlugin = require('progress-bar-webpack-plugin');
 var ExtractTextPlugin = require('extract-text-webpack-plugin');
+var HtmlWebpackPlugin = require('html-webpack-plugin');
+
+var StyleExtractPlugin;
+if (process.env.NODE_ENV === 'production') {
+  StyleExtractPlugin = new ExtractTextPlugin('[name].[hash:8].css');
+} else {
+  StyleExtractPlugin = new ExtractTextPlugin('[name].css');
+}
 
 function convert(str) {
   str = str.replace(/(&#x)(\w{4});/gi, function($0) {
@@ -26,12 +34,12 @@ function wrap(render) {
 
 module.exports = {
   entry: {
-    'zanui-docs': './docs/index.js',
+    'docs': './docs/index.js',
-    'zanui-examples': './docs/examples.js'
+    'examples': './docs/examples.js'
   },
   output: {
     path: path.join(__dirname, '../docs/dist'),
-    publicPath: '/vue/docs/dist/',
+    publicPath: '/',
     filename: '[name].js'
   },
   resolve: {
@@ -88,8 +96,20 @@ module.exports = {
   },
   devtool: 'source-map',
   plugins: [
+    StyleExtractPlugin,
     new ProgressBarPlugin(),
-    new ExtractTextPlugin('[name].css'),
+    new HtmlWebpackPlugin({
+      chunks: ['docs'],
+      template: 'docs/index.tpl',
+      filename: 'index.html',
+      inject: true
+    }),
+    new HtmlWebpackPlugin({
+      chunks: ['examples'],
+      template: 'docs/index.tpl',
+      filename: 'examples.html',
+      inject: true
+    }),
     new webpack.LoaderOptionsPlugin({
       minimize: true,
       options: {
@@ -145,6 +165,11 @@ module.exports = {
 
 if (process.env.NODE_ENV === 'production') {
   delete module.exports.devtool;
+  module.exports.output = {
+    path: path.join(__dirname, '../docs/dist'),
+    publicPath: './',
+    filename: '[name].[hash:8].js'
+  };
   module.exports.plugins = module.exports.plugins.concat([
     new webpack.DefinePlugin({
       'process.env': {
@@ -153,7 +178,8 @@ if (process.env.NODE_ENV === 'production') {
     }),
     new webpack.optimize.UglifyJsPlugin({
       compress: {
-        warnings: false
+        warnings: false,
+        drop_console: true
       },
       output: {
         comments: false

docs/dist/1.js

@@ -1 +0,0 @@
-webpackJsonp([1],{268:function(e,t,n){n(382);var i=n(0)(n(278),n(467),null,null);e.exports=i.exports},278:function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"__esModule",{value:!0});var o=n(29),a=i(o),s=n(436),r=i(s);t.default={data:function(){return{highlights:[],navState:[],data:a.default["zh-CN"],base:"/component"}},components:{MobileNav:r.default}}},280:function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default={props:{group:{type:Object,default:function(){return[]}},base:String},data:function(){return{isOpen:!1}}}},333:function(e,t,n){t=e.exports=n(251)(),t.push([e.i,".side-nav{width:100%;box-sizing:border-box;padding:90px 15px 20px;position:relative;z-index:1}.side-nav .zanui-desc,.side-nav .zanui-title{text-align:center;font-weight:400}.side-nav .zanui-title{font-size:26px;color:#333}.side-nav .zanui-desc{font-size:14px;color:#666;margin-bottom:50px}",""])},343:function(e,t,n){t=e.exports=n(251)(),t.push([e.i,".mobile-nav-group{border-radius:2px;margin-bottom:15px;padding-left:20px;background-color:#fff;box-shadow:0 1px 1px 0 rgba(0,0,0,.1)}.mobile-nav-group li{list-style:none}.mobile-nav-group ul{padding:0;margin:0;overflow:hidden}.mobile-nav-group__title{font-size:16px;color:#333;line-height:56px;position:relative}.mobile-nav-group__title a{color:#333;display:block;border-top:1px solid #e5e5e5}.mobile-nav-group__title .zan-icon-arrow{position:absolute;font-size:12px;line-height:1;top:24px;right:20px}.mobile-nav-group__title--open{color:#999}",""])},382:function(e,t,n){var i=n(333);"string"==typeof i&&(i=[[e.i,i,""]]);n(252)(i,{});i.locals&&(e.exports=i.locals)},392:function(e,t,n){var i=n(343);"string"==typeof i&&(i=[[e.i,i,""]]);n(252)(i,{});i.locals&&(e.exports=i.locals)},436:function(e,t,n){n(392);var i=n(0)(n(280),n(488),null,null);e.exports=i.exports},467:function(e,t){e.exports={render:function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"side-nav"},[n("h1",{staticClass:"zanui-title"},[e._v("Zan UI Wap")]),e._v(" "),n("h2",{staticClass:"zanui-desc"},[e._v("有赞移动wap端组件库")]),e._v(" "),n("div",{staticClass:"mobile-navs"},[e._l(e.data,function(t){return[t.showInMobile?n("div",{staticClass:"mobile-nav-item"},e._l(t.groups,function(t){return n("mobile-nav",{attrs:{group:t,base:e.base}})})):e._e()]})],2)])},staticRenderFns:[]}},488:function(e,t){e.exports={render:function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"mobile-nav-group"},[n("div",{staticClass:"mobile-nav-group__title",class:{"mobile-nav-group__title--open":e.isOpen},on:{click:function(t){e.isOpen=!e.isOpen}}},[e._v("\n    "+e._s(e.group.groupName)+"\n  ")]),e._v(" "),n("ul",{directives:[{name:"show",rawName:"v-show",value:e.isOpen,expression:"isOpen"}],staticClass:"pure-menu-list"},[e._l(e.group.list,function(t){return[t.disabled?e._e():n("li",{staticClass:"mobile-nav-group__title"},[n("router-link",{attrs:{"active-class":"active",to:e.base+t.path},domProps:{textContent:e._s(t.title)}}),e._v(" "),n("zan-icon",{attrs:{name:"arrow"}})],1)]})],2)])},staticRenderFns:[]}}});

docs/index.js

@@ -30,7 +30,7 @@ routesConfig.push({
 
 const router = new VueRouter({
   mode: 'history',
-  base: '/vue',
+  base: __dirname,
   routes: routesConfig
 });
 

docs/index.tpl

@@ -2,9 +2,8 @@
 <html lang="en">
 <head>
   <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
   <title>ZanUI</title>
-  <link rel="stylesheet" type="text/css" href="/vue/docs/dist/zanui-docs.css">
 </head>
 <body>
 
@@ -12,6 +11,5 @@
     <app></app>
   </div>
 
-<script src="/vue/docs/dist/zanui-docs.js"></script>
 </body>
 </html>

examples.html

@@ -1,17 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
-  <title>ZanUI</title>
-  <link rel="stylesheet" type="text/css" href="/vue/docs/dist/zanui-examples.css">
-</head>
-<body>
-
-  <div id="app-container">
-    <app></app>
-  </div>
-
-<script src="/vue/docs/dist/zanui-examples.js"></script>
-</body>
-</html>

package.json

@@ -11,21 +11,22 @@
   ],
   "scripts": {
     "bootstrap": "yarn || npm i --registry=http://registry.npm.qima-inc.com",
-    "dev": "npm run build:file && webpack-dev-server --inline --history-api-fallback --hot --config build/webpack.config.js",
+    "dev": "npm run build:file && webpack-dev-server --inline --history-api-fallback --hot --config build/webpack.config.js --content-base ./",
     "build:file": "node build/bin/build-entry.js",
     "build:utils": "cross-env BABEL_ENV=utils babel src --out-dir lib --ignore src/index.js",
     "build:zanui-css": "gulp build --gulpfile packages/zanui-css/gulpfile.js && cp-cli packages/zanui-css/lib lib/zanui-css",
     "build:components": "webpack --progress --hide-modules --config build/webpack.components.js",
     "build:zanui": "webpack --progress --hide-modules --config build/webpack.build.js && webpack --progress --hide-modules --config build/webpack.build.min.js",
     "build:example": "node build/genExamples.js",
-    "build:docs": "npm run build:example && cross-env NODE_ENV=production webpack --progress --hide-modules --config  build/webpack.config.js",
+    "deploy": "npm run deploy:docs && gh-pages -d docs/dist && rimraf docs/dist",
+    "deploy:docs": "rimraf docs/dist && npm run build:example && cross-env NODE_ENV=production webpack --progress --hide-modules --config  build/webpack.config.js",
     "dist": "npm run clean && npm run build:file && npm run lint && npm run build:zanui && npm run build:components && npm run build:utils && npm run build:zanui-css",
     "clean": "rimraf lib && rimraf packages/*/lib",
     "lint": "eslint src/**/*.js packages/**/*.{js,vue} --quiet",
     "test": "karma start test/unit/karma.conf.js --single-run; npm run coverage",
     "test:watch": "karma start test/unit/karma.conf.js",
     "coverage": "find test/unit/coverage/lcov-report -name 'index.html' | sed -n 1,1p  | xargs -I {} open {}  ",
-    "deploy": "sh build/release.sh"
+    "release": "npm run bootstrap && sh build/release.sh"
   },
   "repository": {
     "type": "git",
@@ -77,6 +78,7 @@
     "extract-text-webpack-plugin": "^2.0.0-beta.5",
     "file-loader": "^0.9.0",
     "file-save": "^0.2.0",
+    "gh-pages": "^0.12.0",
     "gulp": "^3.9.1",
     "gulp-util": "^3.0.8",
     "highlight.js": "^9.8.0",