react-dnd-html5-backend
react-dnd-html5-backend copied to clipboard
Error in console after build using babel presets latest
There seems to be an error importing HTML5Backend
Here's my babel config in package.json
"babel": {
"presets": [
[
"latest",
{
"es2015": {
"modules": false
}
}
],
"react",
"stage-0"
],
"env": {
"production": {
"only": [
"app"
],
"plugins": [
"transform-react-remove-prop-types",
"transform-react-constant-elements",
"transform-react-inline-elements"
]
},
"test": {
"plugins": [
"istanbul"
]
}
}
}
And here's the webpack.config.js file
{
entry: [
path.join(process.cwd(), 'app/app.js'),
],
output: {
path: path.resolve(process.cwd(), 'build'),
publicPath: '/'
filename: '[name].[chunkhash].js',
chunkFilename: '[name].[chunkhash].chunk.js',
},
module: {
loaders: [{
test: /\.js$/,
loader: 'babel',
exclude: /node_modules/,
}, {
test: /\.scss$/,
exclude: /node_modules/,
loaders: ['style', 'css', 'sass'],
}, {
test: /\.css$/,
include: /node_modules/,
loaders: ['style-loader', 'css-loader'],
}, {
test: /\.(eot|svg|ttf|woff|woff2)$/,
loader: 'file-loader',
}, {
test: /\.(jpg|png|gif)$/,
loaders: [
'file-loader',
'image-webpack?{progressive:true, optimizationLevel: 7, interlaced: false, pngquant:{quality: "65-90", speed: 4}}',
],
}, {
test: /\.html$/,
loader: 'html-loader',
}, {
test: /\.json$/,
loader: 'json-loader',
}, {
test: /\.(mp4|webm)$/,
loader: 'url-loader?limit=10000',
}],
},
plugins: [
new WebpackNotifierPlugin({
title: 'Webpack',
excludeWarnings: true
}),
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
children: true,
minChunks: 2,
async: true,
}),
new webpack.optimize.DedupePlugin(),
new HtmlWebpackPlugin({
template: 'app/index.html',
minify: {
removeComments: true,
collapseWhitespace: true,
removeRedundantAttributes: true,
useShortDoctype: true,
removeEmptyAttributes: true,
removeStyleLinkTypeAttributes: true,
keepClosingSlash: true,
minifyJS: true,
minifyCSS: true,
minifyURLs: true,
},
inject: true,
}),
new webpack.ProvidePlugin({
fetch: 'exports?self.fetch!whatwg-fetch',
}),
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: JSON.stringify(process.env.NODE_ENV),
},
}),
new webpack.NamedModulesPlugin(),
]),
resolve: {
modules: ['app', 'node_modules'],
extensions: [
'.js',
'.jsx',
'.react.js',
],
mainFields: [
'browser',
'jsnext:main',
'main',
],
},
target: 'web',
}
I've imported Html5Backend as shown in the docs
import HTML5Backend from 'react-dnd-html5-backend';
Although the webpack build completes successfully, on running, the following error is shown in the browser console.
main.cf54330….js:1 Dynamic page loading failed TypeError: Cannot read property 'call' of undefined
at t (main.cf54330….js:1)
at Object../node_modules/react-dnd-html5-backend/lib/HTML5Backend.js (0.b342625….chunk.js:12)
at t (main.cf54330….js:1)
at Object../node_modules/react-dnd-html5-backend/lib/index.js (0.b342625….chunk.js:12)
at t (main.cf54330….js:1)
at Object../app/containers/ReportingView/index.js (0.b342625….chunk.js:1)
at t (main.cf54330….js:1)
at Object../app/containers/HomePage/index.js (0.b342625….chunk.js:1)
at t (main.cf54330….js:1)