Mr. Guy Mr. Guy - 1 month ago 14
Node.js Question

Module build failed: Error: Plugin 0 specified in "base" provided an invalid property of "definitions"

I am unsuccessfully trying to get webpack to package a production build of my react/redux app. The build succeeds normally, but as soon as I add a webpack plugin to switch the environment as detailed here: http://stackoverflow.com/a/30061249/7114096 (this is linked in the warning logged by redux as I am running a minified dev version) , it falls down.

webpack.config.js:

'use strict';

var webpack = require('webpack');
var path = require('path');

var BUILD_DIR = path.resolve(__dirname, 'web/bundles/frontend/build/react');
var APP_DIR = path.resolve(__dirname, 'web/bundles/frontend/src/react');

var config = {
entry: ['babel-polyfill', APP_DIR + '/search.js'],
output: {
path: BUILD_DIR,
filename: 'search.js'
},
module : {
loaders : [
{
test : /\.js?/,
include : APP_DIR,
loader : 'babel',
query: {
presets: ['react','es2015'],
plugins: [
new webpack.DefinePlugin({
'process.env': {
'NODE_ENV': JSON.stringify('development')
}
}),
"transform-object-rest-spread"
]
}
}
]
}
};

module.exports = config;


package.json:

"babel-cli": "^6.16.0",
"babel-core": "^6.18.2",
"babel-loader": "^6.2.5",
"babel-plugin-transform-object-rest-spread": "^6.16.0",
"babel-polyfill": "^6.16.0",
"babel-preset-es2015": "^6.16.0",
"babel-preset-node5": "^11.1.0",
"babel-preset-react": "^6.16.0",
"bower": "^1.7.9",
"bower-update-all": "^0.1.2",
"csswring": "^5.1.0",
"gulp": "^3.9.1",
"gulp-autoprefixer": "^3.1.0",
"gulp-babel": "^6.1.2",
"gulp-browserify": "^0.5.1",
"gulp-clean-css": "^2.0.11",
"gulp-compass": "^2.1.0",
"gulp-concat": "^2.6.0",
"gulp-imagemin": "^3.0.2",
"gulp-minify": "0.0.12",
"gulp-plumber": "^1.1.0",
"gulp-postcss": "^6.1.1",
"gulp-rename": "^1.2.2",
"gulp-sourcemaps": "^1.6.0",
"gulp-util": "^3.0.7",
"gulp-webpack": "^1.5.0",
"merge-stream": "^1.0.0",
"path": "^0.12.7",
"postcss-cssnext": "^2.7.0",
"react": "^15.3.2",
"react-bootstrap": "^0.30.5",
"react-dom": "^15.3.2",
"react-redux": "^4.4.5",
"redux": "^3.6.0",
"redux-saga": "^0.12.0",
"require-dir": "^0.3.0",
"webpack": "^1.13.3"


And finally the error:

ERROR in ./web/bundles/frontend/src/react/search.js
Module build failed: Error: Plugin 0 specified in "base" provided an invalid property of "definitions"
at Plugin.init (C:\xampp\htdocs\test\node_modules\babel-core\lib\transformation\plugin.js:131:13)
at Function.normalisePlugin (C:\xampp\htdocs\test\node_modules\babel-core\lib\transformation\file\options\option-manager.js:148:12)
at C:\xampp\htdocs\test\node_modules\babel-core\lib\transformation\file\options\option-manager.js:180:30
at Array.map (native)
at Function.normalisePlugins (C:\xampp\htdocs\test\node_modules\babel-core\lib\transformation\file\options\option-manager.js:154:20)
at OptionManager.mergeOptions (C:\xampp\htdocs\test\node_modules\babel-core\lib\transformation\file\options\option-manager.js:229:36)
at OptionManager.init (C:\xampp\htdocs\test\node_modules\babel-core\lib\transformation\file\options\option-manager.js:374:12)
at File.initOptions (C:\xampp\htdocs\test\node_modules\babel-core\lib\transformation\file\index.js:216:65)
at new File (C:\xampp\htdocs\test\node_modules\babel-core\lib\transformation\file\index.js:139:24)
at Pipeline.transform (C:\xampp\htdocs\test\node_modules\babel-core\lib\transformation\pipeline.js:46:16)
at transpile (C:\xampp\htdocs\test\node_modules\babel-loader\index.js:38:20)
at Object.module.exports (C:\xampp\htdocs\test\node_modules\babel-loader\index.js:131:12)
@ multi main


Any thoughts?

Answer

I think you have your plugins defined at the wrong place. Webpack plugin should not be defined inside the loaders

var webpack = require('webpack');
var path = require('path');

var BUILD_DIR = path.resolve(__dirname, 'web/bundles/frontend/build/react');
var APP_DIR = path.resolve(__dirname, 'web/bundles/frontend/src/react');

var config = {
    entry: ['babel-polyfill', APP_DIR + '/search.js'],
    output: {
        path: BUILD_DIR,
        filename: 'search.js'
    },
    module : {
        loaders : [
            {
                test : /\.js?/,
                include : APP_DIR,
                loader : 'babel',
                query: {
                    presets: ['react','es2015'],
                    plugins: ["transform-object-rest-spread"]
                }
            }
        ]
    },
    plugins: [
                        new webpack.DefinePlugin({
                             'process.env': {
                                'NODE_ENV': JSON.stringify('development')
                             }
                         })

                    ]
};

module.exports = config;