add docs for babel and postcss

Author: egoist

README.md

@@ -9,12 +9,12 @@ If you have been suffering from configuration hell, give [vbuild](https://github
 
 ## Features
 
-- Vue 2
-- Latest version of Vuex/Router
-- Webpack 2
-- Babel 6
-- Hot reloading
+- Vue 2 / Vue-router / Vuex
+- Hot reloading for single-file components
 - Split vendor code from your app
+- Webpack 2
+- [Babel 6](/docs/babel.md)
+- [PostCSS](/docs/postcss.md)
 - [JSX components are supported by default](/docs/jsx.md)
 - [Electron support](/docs/electron.md) (optional)
 - [CSS modules](/docs/css-modules.md) (optional)

docs/babel.md

@@ -0,0 +1,20 @@
+# Babel
+
+This default settings for `babel-loader` in Vuepack:
+
+```js
+{
+  babelrc: false,
+  presets: [
+    ['es2015', {modules: false}],
+    'stage-1'
+  ],
+  plugins: [
+    'transform-vue-jsx'
+  ]
+}
+```
+
+Which means you can use all ES2015 and ESnext stage-1 features, and Vue JSX support.
+
+You can update it in `./build/config.js`.

docs/postcss.md

@@ -0,0 +1,15 @@
+# PostCSS
+
+This default settings for `postcss-loader` in Vuepack:
+
+```js
+[
+  require('autoprefixer')({
+    // Vue does not support ie 8 and below
+    browsers: ['last 2 versions', 'ie > 8']
+  }),
+  require('postcss-nested')
+]
+```
+
+You can update it in `./build/config.js`.

template/build/config.js

@@ -2,11 +2,29 @@
 
 module.exports = {
   port: 4000,
+  title: '{{name}}',
   vendor: [
     'vue',
     'vue-router',
     'vuex'
   ],
+  babel: {
+    babelrc: false,
+    presets: [
+      ['es2015', {modules: false}],
+      'stage-1'
+    ],
+    plugins: [
+      'transform-vue-jsx'
+    ]
+  },
+  postcss: [
+    require('autoprefixer')({
+      // Vue does not support ie 8 and below
+      browsers: ['last 2 versions', 'ie > 8']
+    }),
+    require('postcss-nested')
+  ],
   cssModules: true,{{#if electron}}
   electron: true,{{/if}}{{#if jsx}}
   jsx: true{{/if}}

template/build/webpack.base.js

@@ -2,14 +2,7 @@
 const path = require('path')
 const webpack = require('webpack')
 const HtmlWebpackPlugin = require('html-webpack-plugin')
-
-const postcss = [
-  require('autoprefixer')({
-    // Vue does not support ie 8 and below
-    browsers: ['last 2 versions', 'ie > 8']
-  }),
-  require('postcss-nested')
-]
+const config = require('./config')
 
 module.exports = {
   entry: {
@@ -44,24 +37,15 @@ module.exports = {
       }
     ]
   },
-  babel: {
-    babelrc: false,
-    presets: [
-      ['es2015', {modules: false}],
-      'stage-1'
-    ],
-    plugins: [
-      'transform-vue-jsx'
-    ]
-  },
-  postcss,
+  babel: config.babel,
+  postcss: config.postcss,
   vue: {
     loaders: {},
-    postcss
+    postcss: config.postcss
   },
   plugins: [
     new HtmlWebpackPlugin({
-      title: '{{name}}',
+      title: config.title,
       template: __dirname + '/index.html',
       filename: '../index.html'
     })