Use ES6 syntax with Webpack RC4

lib/build/index.js

@@ -1,18 +1,17 @@
 'use strict'
 
 const debug = require('debug')('nuxt:build')
-debug.color = 2 // force green color
-const _ = require('lodash')
-const co = require('co')
-const chokidar = require('chokidar')
-const fs = require('fs-extra')
-const hash = require('hash-sum')
-const pify = require('pify')
-const webpack = require('webpack')
-const { createBundleRenderer } = require('vue-server-renderer')
-const { join, resolve, sep } = require('path')
-const clientWebpackConfig = require('./webpack/client.config.js')
-const serverWebpackConfig = require('./webpack/server.config.js')
+import _ from 'lodash'
+import co from 'co'
+import chokidar from 'chokidar'
+import fs from 'fs-extra'
+import hash from 'hash-sum'
+import pify from 'pify'
+import webpack from 'webpack'
+import { createBundleRenderer } from 'vue-server-renderer'
+import { join, resolve, sep } from 'path'
+import clientWebpackConfig from './webpack/client.config.js'
+import serverWebpackConfig from './webpack/server.config.js'
 const remove = pify(fs.remove)
 const readFile = pify(fs.readFile)
 const writeFile = pify(fs.writeFile)
@@ -36,6 +35,8 @@ const r = function () {
   args = args.map(normalize)
   return wp(resolve.apply(null, args))
 }
+// force green color
+debug.color = 2
 
 const defaults = {
   filenames: {
@@ -73,7 +74,7 @@ const defaultsPostcss = [
   })
 ]
 
-exports.options = function () {
+export function options () {
   // Defaults build options
   let extraDefaults = {}
   if (this.options.build && !Array.isArray(this.options.build.loaders)) extraDefaults.loaders = defaultsLoaders
@@ -90,7 +91,7 @@ exports.options = function () {
   }
 }
 
-exports.build = function * () {
+export function * build () {
   // Check if pages dir exists and warn if not
   if (!fs.existsSync(join(this.srcDir, 'pages'))) {
     if (fs.existsSync(join(this.srcDir, '..', 'pages'))) {

lib/build/webpack/base.config.js

@@ -1,9 +1,9 @@
 'use strict'
 
-const vueLoaderConfig = require('./vue-loader.config')
-const { defaults } = require('lodash')
-const { join } = require('path')
-const { urlJoin } = require('../../utils')
+import vueLoaderConfig from './vue-loader.config'
+import { defaults } from 'lodash'
+import { join } from 'path'
+import { urlJoin } from '../../utils'
 
 /*
 |--------------------------------------------------------------------------
@@ -13,7 +13,7 @@ const { urlJoin } = require('../../utils')
 | webpack config files
 |--------------------------------------------------------------------------
 */
-module.exports = function ({ isClient, isServer }) {
+export default function ({ isClient, isServer }) {
   const nodeModulesDir = join(__dirname, '..', 'node_modules')
   let config = {
     devtool: 'source-map',

lib/build/webpack/client.config.js

@@ -1,10 +1,10 @@
 'use strict'
 
-const _ = require('lodash')
-const webpack = require('webpack')
-const ExtractTextPlugin = require('extract-text-webpack-plugin')
-const base = require('./base.config.js')
-const { resolve } = require('path')
+import { each } from 'lodash'
+import webpack from 'webpack'
+import ExtractTextPlugin from 'extract-text-webpack-plugin'
+import base from './base.config.js'
+import { resolve } from 'path'
 
 /*
 |--------------------------------------------------------------------------
@@ -16,7 +16,7 @@ const { resolve } = require('path')
 | In production, will generate public/dist/style.css
 |--------------------------------------------------------------------------
 */
-module.exports = function () {
+export default function () {
   let config = base.call(this, { isClient: true })
 
   // Entry
@@ -34,7 +34,7 @@ module.exports = function () {
 
   // env object defined in nuxt.config.js
   let env = {}
-  _.each(this.options.env, (value, key) => {
+  each(this.options.env, (value, key) => {
     env['process.env.' + key] = (typeof value === 'string' ? JSON.stringify(value) : value)
   })
   // Webpack plugins

lib/build/webpack/server.config.js

@@ -1,23 +1,22 @@
 'use strict'
 
-const _ = require('lodash')
-const webpack = require('webpack')
-const base = require('./base.config.js')
-const { uniq } = require('lodash')
-const { existsSync, readFileSync } = require('fs')
-const { resolve } = require('path')
+import webpack from 'webpack'
+import base from './base.config.js'
+import { each, uniq } from 'lodash'
+import { existsSync, readFileSync } from 'fs'
+import { resolve } from 'path'
 
 /*
 |--------------------------------------------------------------------------
 | Webpack Server Config
 |--------------------------------------------------------------------------
 */
-module.exports = function () {
+export default function () {
   let config = base.call(this, { isServer: true })
 
   // env object defined in nuxt.config.js
   let env = {}
-  _.each(this.options.env, (value, key) => {
+  each(this.options.env, (value, key) => {
     env['process.env.' + key] = (typeof value === 'string' ? JSON.stringify(value) : value)
   })
 

lib/build/webpack/vue-loader.config.js

@@ -1,8 +1,8 @@
 'use strict'
 
-const { defaults } = require('lodash')
+import { defaults } from 'lodash'
 
-module.exports = function ({ isClient }) {
+export default function ({ isClient }) {
   let babelOptions = JSON.stringify(defaults(this.options.build.babel, {
     plugins: [
       'transform-async-to-generator',

lib/generate.js

@@ -1,14 +1,14 @@
 'use strict'
 
 const debug = require('debug')('nuxt:generate')
-const fs = require('fs-extra')
-const co = require('co')
-const pify = require('pify')
-const pathToRegexp = require('path-to-regexp')
-const _ = require('lodash')
-const { resolve, join, dirname, sep } = require('path')
-const { promisifyRouteParams } = require('./utils')
-const { minify } = require('html-minifier')
+import fs from 'fs-extra'
+import co from 'co'
+import pify from 'pify'
+import pathToRegexp from 'path-to-regexp'
+import _ from 'lodash'
+import { resolve, join, dirname, sep } from 'path'
+import { promisifyRouteParams } from './utils'
+import { minify } from 'html-minifier'
 const copy = pify(fs.copy)
 const remove = pify(fs.remove)
 const writeFile = pify(fs.writeFile)
@@ -19,7 +19,7 @@ const defaults = {
   routeParams: {}
 }
 
-module.exports = function () {
+export default function () {
   const s = Date.now()
   /*
   ** Update loaders config to add router.base path

lib/nuxt.js

@@ -1,16 +1,18 @@
-const _ = require('lodash')
-const co = require('co')
-const fs = require('fs-extra')
-const pify = require('pify')
-const ansiHTML = require('ansi-html')
-const serialize = require('serialize-javascript')
-const Server = require('./server')
-const build = require('./build')
-const render = require('./render')
-const generate = require('./generate')
-const serveStatic = require('serve-static')
-const { resolve, join } = require('path')
-const { encodeHtml, setAnsiColors } = require('./utils')
+'use strict'
+
+import _ from 'lodash'
+import co from 'co'
+import fs from 'fs-extra'
+import pify from 'pify'
+import ansiHTML from 'ansi-html'
+import serialize from 'serialize-javascript'
+import Server from './server'
+import * as build from './build'
+import * as render from './render'
+import generate from './generate'
+import serveStatic from 'serve-static'
+import { resolve, join } from 'path'
+import { encodeHtml, setAnsiColors } from './utils'
 setAnsiColors(ansiHTML)
 
 class Nuxt {
@@ -112,4 +114,4 @@ class Nuxt {
 
 }
 
-module.exports = Nuxt
+export default Nuxt

lib/render.js

@@ -1,10 +1,12 @@
-const debug = require('debug')('nuxt:render')
-debug.color = 4 // force blue color
-const co = require('co')
-const { urlJoin } = require('./utils')
-const { getContext } = require('./utils')
+'use strict'
 
-exports.render = function (req, res) {
+const debug = require('debug')('nuxt:render')
+import co from 'co'
+import { urlJoin, getContext } from './utils'
+// force blue color
+debug.color = 4
+
+export function render (req, res) {
   if (!this.renderer && !this.dev) {
     console.error('> No build files found, please run `nuxt build` before launching `nuxt start`') // eslint-disable-line no-console
     process.exit(1)
@@ -62,7 +64,7 @@ exports.render = function (req, res) {
   })
 }
 
-exports.renderRoute = function (url, context = {}) {
+export function renderRoute (url, context = {}) {
   debug(`Rendering url ${url}`)
   // Add url and isSever to the context
   context.url = url
@@ -95,7 +97,7 @@ exports.renderRoute = function (url, context = {}) {
 
 // Function used to do dom checking via jsdom
 let jsdom = null
-exports.renderAndGetWindow = function renderAndGetWindow (url) {
+export function renderAndGetWindow (url) {
   /* istanbul ignore if */
   if (!jsdom) {
     try {

lib/server.js

@@ -30,4 +30,4 @@ class Server {
 
 }
 
-module.exports = Server
+export default Server

lib/utils.js

@@ -1,10 +1,14 @@
 'use strict'
 
-exports.encodeHtml = (str) => str.replace(/</g, '&lt;').replace(/>/g, '&gt;')
+export function encodeHtml (str) {
+  str.replace(/</g, '&lt;').replace(/>/g, '&gt;')
+}
 
-exports.getContext = (req, res) => ({ req, res })
+export function getContext (req, res) {
+  return { req, res }
+}
 
-exports.setAnsiColors = function (ansiHTML) {
+export function setAnsiColors (ansiHTML) {
   ansiHTML.setColors({
     reset: ['efefef', 'a6004c'],
     darkgrey: '5a012b',
@@ -17,17 +21,17 @@ exports.setAnsiColors = function (ansiHTML) {
   })
 }
 
-exports.waitFor = function * (ms) {
+export function * waitFor (ms) {
   return new Promise(function (resolve) {
     setTimeout(resolve, (ms || 0))
   })
 }
 
-exports.urlJoin = function () {
+export function urlJoin () {
   return [].slice.call(arguments).join('/').replace(/\/+/g, '/')
 }
 
-exports.promisifyRouteParams = function (fn) {
+export function promisifyRouteParams (fn) {
   // If routeParams[route] is an array
   if (Array.isArray(fn)) {
     return Promise.resolve(fn)

package.json

@@ -81,7 +81,7 @@
     "vue-server-renderer": "^2.1.8",
     "vue-template-compiler": "^2.1.8",
     "vuex": "^2.1.1",
-    "webpack": "2.2.0-rc.3",
+    "webpack": "2.2.0-rc.4",
     "webpack-dev-middleware": "^1.9.0",
     "webpack-hot-middleware": "^2.14.0"
   },