I get a lot of errors when trying to create my application using Webpack and don't know what to do. I looked at other solutions suggesting adding things like target: 'web'and to webpack.config.prod.js node: {fs: "empty"}, but none of them fixed the errors. The following is a list of errors (about 150 in total) on the console after startup sudo npm run build:
A mistake in. /~/ejs/lib/ejs.js Module not found: Error: Cannot resolve module 'fs' in / tidee / auth_app / node_modules / ejs / lib @. /~/ejs/lib/ejs.js 47: 9-22
A mistake in. /~/express/lib/request.js Module not found: Error: Cannot resolve module 'net' in / tidee / auth_app / node_modules / express / lib @. /~/express/lib/request.js 18: 11-25
A mistake in. / ~ / node-pre-gyp / lib / node-pre-gyp.js Module not found: Error: Cannot resolve the "file" or "directory" .. / package in / tidee / auth _app / node_modules / node -pre -gyp / lib @. /~/node-pre-gyp/lib/node-pre-gyp.js 60: 16-37
A mistake in. /~/ps-tree/index.js Module not found: Error: Cannot resolve the 'child_process' module in / tidee / auth _app / node_modules / ps-tree @. /~/ps-tree/index.js 3: 12-36
Below is my webpack.config.prod.js file:
const path = require('path');
var webpack = require("webpack");
var CompressionPlugin = require('compression-webpack-plugin');
const pkg = require("./package.json");
module.exports = {
entry: {
vendor: Object.keys(pkg.dependencies).filter(function (v) {
return v;
}),
app: path.join(__dirname, '/client/src/app.jsx')
},
output: {
path: path.join(__dirname, '/client/dist'),
filename: '[name].js',
publicPath: 'http://example.com/public/'
},
resolve: {
root: path.resolve('./client/dist'),
extensions: ['', '.js', '.jsx', '.less', '.css'],
alias: {
'jquery-ui': 'jquery-ui-dist/jquery-ui.js'
}
},
module: {
loaders: [{
test: /\.js?$/,
loaders: ['babel'],
include: path.join(__dirname, '/shared')
},{
test: /\.jsx?$/,
loaders: ['react-hot','babel?' + JSON.stringify({
presets: ["es2015", "stage-0", "react"]
})],
include: path.join(__dirname, '/client/src')
},{
test: /\.less$/,
loaders: ['style', 'css', 'less']
},{
test: /\.css$/,
loaders: ['style', 'css']
},
{
test: /\.ico$/,
loader: "file-loader"
},
{
test: /\.png$/,
loader: "url-loader?limit=100000"
},
{
test: /\.jpg$/,
loader: "file-loader"
},
{
test: /\.(woff|woff2)(\?v=\d+\.\d+\.\d+)?$/,
loader: 'url?limit=10000&mimetype=application/font-woff'
},
{
test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/,
loader: 'url'
},
{
test: /\.eot(\?v=\d+\.\d+\.\d+)?$/,
loader: 'file'
},
{
test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
loader: 'url?limit=10000&mimetype=image/svg+xml'
},{
test: /\.json$/,
loader: "json-loader"
}]
},
plugins: [
new webpack.DefinePlugin({
'process.env': {
'NODE_ENV': JSON.stringify('production')
}
}),
new webpack.ProvidePlugin({
"$":"jquery",
"jQuery":"jquery",
'global.jQuery': 'jquery'
}),
new webpack.optimize.OccurenceOrderPlugin(),
new webpack.NoErrorsPlugin(),
new webpack.DefinePlugin({ 'typeof window': '\"object\"' }),
new webpack.optimize.DedupePlugin(),
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
}
}),
new CompressionPlugin({
asset: "[path].gz[query]",
algorithm: "gzip",
test: /\.js$|\.css$|\.html$/,
threshold: 10240,
minRatio: 0.8
})
]
};
Note: I am using Node v7.2.1 and Webpack v1.14.0