I am using aws-iot-device-sdk in our reactjs application. We're getting an error when running NODE_ENV=production npm run compile command. Following is the error I'm getting and I attached my webpack configuration and versions of node & npm.
Module parse failed: /Users/Anesh/react/aws-iot-example/node_modules/strip-loader/lib/index.js?strip[]=console.log!/Users/Anesh/react/aws-iot-example/node_modules/aws-iot-device-sdk/thing/index.js Unexpected token (499:11)
app:build:webpack-compiler You may need an appropriate loader to handle this file type.
app:build:webpack-compiler SyntaxError: Unexpected token (499:11)
app:build:webpack-compiler at Parser.pp$4.raise (/Users/Anesh/react/aws-iot-example/node_modules/webpack/node_modules/acorn/dist/acorn.js:2221:15)
app:build:webpack-compiler at Parser.pp.unexpected (/Users/Anesh/react/aws-iot-example/node_modules/webpack/node_modules/acorn/dist/acorn.js:603:10)
app:build:webpack-compiler at Parser.pp.expect (/Users/Anesh/react/aws-iot-example/node_modules/webpack/node_modules/acorn/dist/acorn.js:597:28)
app:build:webpack-compiler at Parser.pp$3.parseExprList (/Users/Anesh/react/aws-iot-example/node_modules/webpack/node_modules/acorn/dist/acorn.js:2152:16)
app:build:webpack-compiler at Parser.pp$3.parseSubscripts (/Users/Anesh/react/aws-iot-example/node_modules/webpack/node_modules/acorn/dist/acorn.js:1741:35)
app:build:webpack-compiler at Parser.pp$3.parseExprSubscripts (/Users/Anesh/react/aws-iot-example/node_modules/webpack/node_modules/acorn/dist/acorn.js:1718:17)
app:build:webpack-compiler at Parser.pp$3.parseMaybeUnary (/Users/Anesh/react/aws-iot-example/node_modules/webpack/node_modules/acorn/dist/acorn.js:1692:19)
app:build:webpack-compiler at Parser.pp$3.parseExprOps (/Users/Anesh/react/aws-iot-example/node_modules/webpack/node_modules/acorn/dist/acorn.js:1637:21)
app:build:webpack-compiler at Parser.pp$3.parseMaybeConditional (/Users/Anesh/react/aws-iot-example/node_modules/webpack/node_modules/acorn/dist/acorn.js:1620:21)
app:build:webpack-compiler at Parser.pp$3.parseMaybeAssign (/Users/Anesh/react/aws-iot-example/node_modules/webpack/node_modules/acorn/dist/acorn.js:1597:21)
app:build:webpack-compiler at Parser.pp$3.parseExpression (/Users/Anesh/react/aws-iot-example/node_modules/webpack/node_modules/acorn/dist/acorn.js:1573:21)
app:build:webpack-compiler at Parser.pp$1.parseStatement (/Users/Anesh/react/aws-iot-example/node_modules/webpack/node_modules/acorn/dist/acorn.js:727:47)
app:build:webpack-compiler at Parser.pp$1.parseBlock (/Users/Anesh/react/aws-iot-example/node_modules/webpack/node_modules/acorn/dist/acorn.js:981:25)
app:build:webpack-compiler at Parser.pp$1.parseStatement (/Users/Anesh/react/aws-iot-example/node_modules/webpack/node_modules/acorn/dist/acorn.js:709:33)
app:build:webpack-compiler at Parser.pp$1.parseIfStatement (/Users/Anesh/react/aws-iot-example/node_modules/webpack/node_modules/acorn/dist/acorn.js:824:28)
app:build:webpack-compiler at Parser.pp$1.parseStatement (/Users/Anesh/react/aws-iot-example/node_modules/webpack/node_modules/acorn/dist/acorn.js:698:30)
This is my webpack config file webpack.config.js
const webpack = require('webpack')
const cssnano = require('cssnano')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const ExtractTextPlugin = require('extract-text-webpack-plugin')
const CircularDependencyPlugin = require('circular-dependency-plugin')
const WebpackStrip = require('strip-loader')
const config = require('../config')
const debug = require('debug')('app:webpack:config')
const paths = config.utils_paths
const __DEV__ = config.globals.__DEV__
const __PROD__ = config.globals.__PROD__
const __TEST__ = config.globals.__TEST__
debug('Creating configuration.')
const webpackConfig = {
name: 'client',
target: 'web',
devtool: config.compiler_devtool,
resolve: {
root: paths.client(),
extensions: ['', '.js', '.jsx', '.json']
},
module: {
noParse: [new RegExp('node_modules/localforage/dist/localforage.js')]
}
}
// ------------------------------------
// Entry Points
// ------------------------------------
const APP_ENTRY = paths.client('main.js')
webpackConfig.entry = {
app: __DEV__
? ['babel-polyfill', APP_ENTRY].concat(
`webpack-hot-middleware/client?path=${
config.compiler_public_path
}__webpack_hmr`
)
: ['babel-polyfill', APP_ENTRY],
vendor: config.compiler_vendors
}
// ------------------------------------
// Bundle Output
// ------------------------------------
webpackConfig.output = {
filename: `[name].[${config.compiler_hash_type}].js`,
path: paths.dist(),
publicPath: config.compiler_public_path
}
// ------------------------------------
// Plugins
// ------------------------------------
webpackConfig.plugins = [
new webpack.DefinePlugin(config.globals),
new HtmlWebpackPlugin({
template: paths.client('index.html'),
hash: false,
favicon: paths.client('static/favicon.ico'),
filename: 'index.html',
inject: 'body',
minify: {
collapseWhitespace: true
}
}),
new CircularDependencyPlugin({
// exclude detection of files based on a RegExp
exclude: /a\.js|node_modules/,
// add errors to webpack instead of warnings
failOnError: true
})
]
if (__DEV__) {
debug('Enable plugins for live development (HMR, NoErrors).')
webpackConfig.plugins.push(
new webpack.HotModuleReplacementPlugin(),
new webpack.NoErrorsPlugin()
)
} else if (__PROD__) {
debug('Enable plugins for production (OccurenceOrder, Dedupe & UglifyJS).')
webpackConfig.plugins.push(
new webpack.optimize.OccurrenceOrderPlugin(),
new webpack.optimize.DedupePlugin(),
new webpack.optimize.UglifyJsPlugin({
compress: {
unused: true,
dead_code: true,
warnings: false
}
})
)
}
// Don't split bundles during testing, since we only want import one bundle
if (!__TEST__) {
webpackConfig.plugins.push(
new webpack.optimize.CommonsChunkPlugin({
names: ['vendor']
})
)
}
// ------------------------------------
// Loaders
// ------------------------------------
// JavaScript / JSON
webpackConfig.module.loaders = [
{
test: /\.(js|jsx)$/,
exclude: /node_modules/,
loader: 'babel',
query: config.compiler_babel
},
{
test: /\.json$/,
loader: 'json'
}
]
if (__PROD__) {
webpackConfig.module.loaders.push({
test: /\.js$/,
loader: WebpackStrip.loader('console.log')
})
}
// ------------------------------------
// Finalize Configuration
// ------------------------------------
// when we don't know the public path (we know it only when HMR is enabled [in development]) we
// need to use the extractTextPlugin to fix this issue:
// http://stackoverflow.com/questions/34133808/webpack-ots-parsing-error-loading-fonts/34133809#34133809
if (!__DEV__) {
debug('Apply ExtractTextPlugin to CSS loaders.')
webpackConfig.module.loaders
.filter(
loader =>
loader.loaders &&
loader.loaders.find(name => /css/.test(name.split('?')[0]))
)
.forEach(loader => {
const first = loader.loaders[0]
const rest = loader.loaders.slice(1)
loader.loader = ExtractTextPlugin.extract(first, rest.join('!'))
delete loader.loaders
})
webpackConfig.plugins.push(
new ExtractTextPlugin('[name].[contenthash].css', {
allChunks: true
})
)
}
webpackConfig.node = {
tls: 'empty',
fs: 'empty'
}
module.exports = webpackConfig
Following versions are installed in my laptop
node: v7.3.0
npm: 4.6.1
