Update to new version

.babelrc

@@ -1,3 +1,4 @@
 {
-  "presets": ["es2015-webpack", "stage-2"]
-}
+  "presets": [["es2015", { "modules": false }], "stage-2"],
+  "ignore": ["node_modules/*"]
+}

README.md

@@ -1,6 +1,6 @@
-# vue-ssr-demo
+# vue-ssr-starter-kit
 
-> A Vue.js project with vue 2.0 and vue-router@next for server-side rendering.
+> A Vue.js project with vue 2.0, vue-router and vuex starter kit for server side rendering.
 
 ## Build Setup
 
@@ -15,4 +15,8 @@ npm start
 ```bash
 npm install
 npm run dev
-```
+```
+
+## License
+
+[MIT](http://opensource.org/licenses/MIT)

build/webpack.base.config.js

@@ -1,26 +1,18 @@
-var path = require('path')
-var webpack = require('webpack')
+const path = require('path')
 
 module.exports = {
+  devtool: '#source-map',
   entry: {
-    app: './src/client-entry.js'
+    app: './src/client-entry.js',
+    vendor: ['vue', 'vue-router', 'vuex', 'vuex-router-sync', 'axios']
   },
   output: {
     path: path.resolve(__dirname, '../dist'),
-    publicPath: '/',
+    publicPath: '/dist/',
     filename: 'client-bundle.js'
   },
-  resolve: {
-    extensions: ['', '.js', '.vue'],
-    fallback: [path.join(__dirname, '../node_modules')],
-    alias: {
-      'src': path.resolve(__dirname, '../src'),
-      'assets': path.resolve(__dirname, '../src/assets'),
-      'components': path.resolve(__dirname, '../src/components')
-    }
-  },
   resolveLoader: {
-    fallback: [path.join(__dirname, '../node_modules')]
+    root: path.join(__dirname, '../node_modules'),
   },
   module: {
     loaders: [
@@ -33,10 +25,6 @@ module.exports = {
         loader: 'babel',
         exclude: /node_modules/
       },
-      {
-        test: /\.json$/,
-        loader: 'json'
-      },
       {
         test: /\.(png|jpg|gif|svg)$/,
         loader: 'file',
@@ -45,15 +33,5 @@ module.exports = {
         }
       }
     ]
-  },
-  plugins: [
-    new webpack.DefinePlugin({
-      'process': {
-        env: {
-          NODE_ENV: JSON.stringify(process.env.NODE_ENV)
-        }
-      }
-    })
-  ],
-  devtool: '#eval-source-map'
-}
+  }
+}

build/webpack.client.config.js

@@ -1,17 +1,46 @@
+const base = require('./webpack.base.config')
 const webpack = require('webpack')
-const merge = require('webpack-merge')
-const baseWebpackConfig = require('./webpack.base.config')
 
-webpackConfig = merge(baseWebpackConfig, {})
+const config = Object.assign({}, base, {
+  plugins: [
+    // strip comments in Vue code
+    new webpack.DefinePlugin({
+      'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV || 'development')
+    }),
+    // extract vendor chunks for better caching
+    new webpack.optimize.CommonsChunkPlugin({
+      name: 'vendor',
+      filename: 'client-vendor-bundle.js'
+    })
+  ]
+})
 
-// if (process.env.NODE_ENV === 'production') {
-//   webpackConfig.devtool = '#source-map'
-//   webpackConfig.plugins.push(
-//     new webpack.optimize.UglifyJsPlugin({
-//       compress: {
-//         warnings: false
-//       }
-//     })
-//   )
-// }
-module.exports = webpackConfig
+if (process.env.NODE_ENV === 'production') {
+  // extract CSS into a single file so it's applied on initial render
+  const ExtractTextPlugin = require('extract-text-webpack-plugin')
+
+  config.vue = {
+    loaders: {
+      css: ExtractTextPlugin.extract({
+        loader: "css-loader",
+        fallbackLoader: "vue-style-loader"
+      })
+    }
+  }
+
+  config.plugins.push(
+    new ExtractTextPlugin('styles.css'),
+    // this is needed in webpack 2 for minifying CSS
+    new webpack.LoaderOptionsPlugin({
+      minimize: true
+    }),
+    // minify JS
+    new webpack.optimize.UglifyJsPlugin({
+      compress: {
+        warnings: false
+      }
+    })
+  )
+}
+
+module.exports = config

build/webpack.server.config.js

@@ -1,26 +1,19 @@
 const webpack = require('webpack')
-const merge = require('webpack-merge')
-const baseWebpackConfig = require('./webpack.base.config')
+const base = require('./webpack.base.config')
 
-webpackConfig = merge(baseWebpackConfig, {
+module.exports = Object.assign({}, base, {
   target: 'node',
-  entry: {
-    app: './src/server-entry.js'
-  },
-  output: {
+  devtool: null,
+  entry: './src/server-entry.js',
+  output: Object.assign({}, base.output, {
     filename: 'server-bundle.js',
     libraryTarget: 'commonjs2'
-  },
+  }),
+  externals: ['axios'],
   plugins: [
     new webpack.DefinePlugin({
-      'process': {
-        env: {
-          NODE_ENV: '"production"',
-          VUE_ENV: '"server"'
-        }
-      }
+      'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV || 'development'),
+      'process.env.VUE_ENV': '"server"'
     })
   ]
 })
-
-module.exports = webpackConfig

package.json

@@ -1,42 +1,38 @@
 {
-  "name": "vue-ssr-demo",
-  "description": "A Vue.js project wuth vue 2.0 and vue-router@next for server-side rendering.",
+  "name": "vue-ssr-starter-kit",
+  "description": "A Vue.js project wuth vue 2.0, vue-router and vuex for server side rendering.",
   "author": "doabit <[email protected]>",
   "private": true,
   "scripts": {
-    "start": "node server",
-    "dev": "nodemon --watch ./build ./build/dev-server.js",
-    "build:client": "cross-env NODE_ENV=production webpack --config ./build/webpack.client.config.js",
-    "build:server": "cross-env NODE_ENV=production webpack --config ./build/webpack.server.config.js",
-    "build": "cross-env NODE_ENV=production webpack --config ./build/webpack.client.config.js && cross-env NODE_ENV=production webpack --config ./build/webpack.server.config.js"
+    "start": "NODE_ENV=production node server",
+    "dev": "node server",
+    "build:client": "NODE_ENV=production webpack --config ./build/webpack.client.config.js --progress --hide-modules",
+    "build:server": "NODE_ENV=production webpack --config ./build/webpack.server.config.js --progress --hide-modules",
+    "build": "npm run build:client && npm run build:server"
   },
   "dependencies": {
     "axios": "^0.13.1",
-    "body-parser": "^1.15.2",
     "express": "^4.14.0",
     "lru-cache": "^4.0.1",
     "serialize-javascript": "^1.3.0",
     "serve-favicon": "^2.3.0",
-    "vue": "^2.0.0-beta.6",
-    "vue-resource": "^0.9.3",
+    "vue": "^2.0.0-beta.7",
     "vue-router": "^2.0.0-rc.1",
     "vue-server-renderer": "^2.0.0-beta.6",
-    "vuex": "^2.0.0-rc.3"
+    "vuex": "^2.0.0-rc.4",
+    "vuex-router-sync": "^3.0.0"
   },
   "devDependencies": {
-    "babel-core": "^6.0.0",
+    "babel-core": "^6.13.2",
     "babel-loader": "^6.0.0",
-    "babel-preset-es2015-webpack": "^6.0.0",
+    "babel-preset-es2015": "^6.13.2",
     "babel-preset-stage-2": "^6.13.0",
-    "cross-env": "^1.0.6",
     "css-loader": "^0.23.1",
+    "extract-text-webpack-plugin": "^2.0.0-beta.3",
     "file-loader": "^0.8.4",
-    "json-loader": "^0.5.4",
-    "nodemon": "^1.10.0",
     "vue-loader": "^9.2.2",
     "webpack": "^2.1.0-beta.20",
-    "webpack-dev-server": "^2.1.0-beta.0",
-    "webpack-hot-middleware": "^2.12.2",
-    "webpack-merge": "^0.14.1"
+    "webpack-dev-middleware": "^1.6.1",
+    "webpack-hot-middleware": "^2.12.2"
   }
 }