Integrate Webpack Validator Into Webpack.Config.js

.travis.yml

@@ -2,7 +2,6 @@
 language: cpp
 sudo: false
 env:
-  - export NODE_VERSION="0.12"
   - export NODE_VERSION="4"
   - export NODE_VERSION="6"
 os:

bin/gatsby.js

@@ -9,14 +9,11 @@ global.appStartTime = Date.now()
 var sysPath = require('path')
 var fs = require('fs')
 var version = process.version
-var versionDigits = version.split('.')
-  .map(function (d) { return d.match(/\d+/)[0] })
-  .slice(0, 2).join('.')
-var verDigit = Number(versionDigits)
+var verDigit = Number(version.match(/\d+/)[0])
 
-if (verDigit < 0.12) {
+if (verDigit < 4) {
   console.error(
-    'Error: Gatsby 0.9+ requires node.js v0.12 or higher (you have ' + version + ') ' +
+    'Error: Gatsby 0.13+ requires node.js v4 or higher (you have ' + version + ') ' +
     'Upgrade node to the latest stable release.'
   )
   process.exit()

lib/utils/build-css.js

@@ -8,7 +8,7 @@ module.exports = (program, callback) => {
 
   const compilerConfig = webpackConfig(program, directory, 'build-css')
 
-  return webpack(compilerConfig.resolve()).run((err, stats) => {
+  return webpack(compilerConfig).run((err, stats) => {
     // We don't want any javascript produced by this step in the process.
     fs.unlinkSync(`${directory}/public/bundle-for-css.js`)
 

lib/utils/build-html.js

@@ -16,7 +16,7 @@ module.exports = (program, callback) => {
     // Static site generation.
     const compilerConfig = webpackConfig(program, directory, 'build-html', null, routes)
 
-    webpack(compilerConfig.resolve()).run((e, stats) => {
+    webpack(compilerConfig).run((e, stats) => {
       if (e) {
         return callback(e, stats)
       }

lib/utils/build-javascript.js

@@ -7,5 +7,5 @@ module.exports = (program, callback) => {
 
   const compilerConfig = webpackConfig(program, directory, 'build-javascript')
 
-  return webpack(compilerConfig.resolve()).run(callback)
+  return webpack(compilerConfig).run(callback)
 }

lib/utils/develop.js

@@ -33,7 +33,7 @@ function startServer (program, launchPort) {
   return globPages(directory, (err, pages) => {
     const compilerConfig = webpackConfig(program, directory, 'develop', program.port)
 
-    const compiler = webpack(compilerConfig.resolve())
+    const compiler = webpack(compilerConfig)
 
     let HTMLPath = `${directory}/html`
     // Check if we can't find an html component in root of site.
@@ -43,7 +43,7 @@ function startServer (program, launchPort) {
 
     const htmlCompilerConfig = webpackConfig(program, directory, 'develop-html', program.port)
 
-    webpackRequire(htmlCompilerConfig.resolve(), require.resolve(HTMLPath), (error, factory) => {
+    webpackRequire(htmlCompilerConfig, require.resolve(HTMLPath), (error, factory) => {
       if (error) {
         console.log(`Failed to require ${directory}/html.js`)
         error.forEach((e) => {

lib/utils/webpack.config.js

@@ -1,11 +1,12 @@
+import chalk from 'chalk'
 import webpack from 'webpack'
 import StaticSiteGeneratorPlugin from 'static-site-generator-webpack-plugin'
 import ExtractTextPlugin from 'extract-text-webpack-plugin'
 import Config from 'webpack-configurator'
 const debug = require('debug')('gatsby:webpack-config')
 import path from 'path'
 import _ from 'lodash'
-import invariant from 'invariant'
+import validate from 'webpack-validator'
 
 import babelConfig from './babel-config'
 
@@ -440,16 +441,35 @@ module.exports = (program, directory, suppliedStage, webpackPort = 1500, routes
     resolve: resolve(),
   })
 
-  if (modifyWebpackConfig) {
-    const modifiedWebpackConfig = modifyWebpackConfig(module(config), stage)
-    invariant(_.isObject(modifiedWebpackConfig),
-              `
-              You must return an object when modifying the Webpack config.
-              Returned: ${modifiedWebpackConfig}
-              stage: ${stage}
-              `)
-    return modifiedWebpackConfig
-  } else {
-    return module(config)
+  let exportedWebpackConfig = module(config)
+  if (!!modifyWebpackConfig) {
+    exportedWebpackConfig = modifyWebpackConfig(module(config), stage)
   }
+
+  console.log(exportedWebpackConfig.resolve().context)
+
+  const validationState = validate(exportedWebpackConfig.resolve(), {
+    returnValidation: true,
+  })
+
+  const notAbsoluteError = validationState.error.details.reduce((state, error) => {
+    console.log(state, error)
+    if (state) return true
+    if (error.type === 'path.absolute') return false
+    else return true
+  }, false)
+  if (validationState.error && notAbsoluteError) {
+    console.log(chalk.red('There are issues with your webpack config. Here are the errors'), '\n')
+
+    validationState.error.details.forEach((err, index) => {
+      console.log(chalk.yellow(`[${index + 1}] ========================================`))
+      console.log(chalk.yellow(err.type, ', ', err.message))
+      console.log(chalk.yellow(`Found under ${err.path} in your webpack config`))
+      console.log('\n')
+    })
+
+    return process.exit(1)
+  }
+
+  return exportedWebpackConfig.resolve()
 }

package.json

@@ -26,6 +26,7 @@
     "babel-preset-react-hmre": "^1.1.1",
     "babel-preset-stage-0": "^6.5.0",
     "boom": "^2.7.2",
+    "chalk": "^1.1.3",
     "cjsx-loader": "^3.0.0",
     "coffee-loader": "^0.7.2",
     "coffee-script": "^1.9.3",
@@ -85,6 +86,7 @@
     "webpack-configurator": "^0.3.0",
     "webpack-hot-middleware": "^2.12.2",
     "webpack-require": "0.0.16",
+    "webpack-validator": "^2.2.7",
     "yaml-loader": "^0.4.0"
   },
   "devDependencies": {
@@ -112,7 +114,7 @@
     "nyc": "^7.0.0"
   },
   "engines": {
-    "node": ">0.12.0"
+    "node": ">4.0.0"
   },
   "homepage": "https://github.com/gatsbyjs/gatsby#readme",
   "keywords": [