I'm currently working on a react webpack babel etc site and trying to build the first time. The build is successful, but when I open up the browser I get the following error:
Uncaught Error: Cannot find module "/Users/michael.nakayama/Documents/Development/jamsesh/node_modules/webpack/node_modules/node-libs-browser/node_modules/process/browser.js"
This module exists. Going to that actual url in my browser shows the file in question. But I cannot figure out why webpack cannot find it. I don't know if this is a babel6 issue or a webpack issue, or neither. My config file looks like this:
var webpack = require('webpack'); var cleanWebpack = require('clean-webpack-plugin'); var ignore = new webpack.IgnorePlugin(new RegExp("/(node_modules|ckeditor)/")) module.exports = { devtool: 'inline-source-map', entry: './lib/client/entry', output: { path: __dirname + '/public/js', filename: 'app.js', publicPath: 'http://localhost:8081/js/', }, plugins: [ ignore, ], resolve: { extensions: ['', '.js'], moduleDirectories: ['./node_modules'] }, module: { loaders: [ { test: /\.js?$/, loaders: ['babel-loader?presets[]=react,presets[]=es2015,plugins[]=transform-es2015-classes,plugins[]=transform-react-jsx'], exclude: /(node_modules)/, } ] } }
and my webpack server file is as follows:
var WebpackDevServer = require('webpack-dev-server'); var webpack = require('webpack'); var config = require('../../webpack.config'); var server = new WebpackDevServer(webpack(config), { // webpack-dev-server options publicPath: config.output.publicPath, stats: { colors: true }, }); server.listen(8081, 'localhost', function() {});
and here are the packages I have installed:
"devDependencies": { "babel-cli": "^6.3.17", "babel-core": "^6.3.26", "babel-loader": "^6.2.0", "babel-plugin-syntax-jsx": "^6.3.13", "babel-plugin-transform-es2015-classes": "^6.4.0", "babel-plugin-transform-react-jsx": "^6.3.13", "babel-preset-es2015": "^6.3.13", "babel-preset-react": "^6.3.13", "body-parser": "^1.14.2", "clean-webpack-plugin": "^0.1.5", "express": "^4.13.3", "history": "^1.17.0", "jade": "^1.11.0", "nodemon": "^1.8.1", "path": "^0.12.7", "pg": "^4.4.3", "react": "^0.14.6", "react-dom": "^0.14.3", "react-hot-loader": "^1.3.0", "react-router": "^1.0.3", "webpack": "^1.12.9", "webpack-dev-server": "^1.14.0" }
entry.js:
var React = require('react'); var ReactDOM = require('react-dom'); var ReactRouter = require('react-router'); var Router = ReactRouter.Router; var Route = ReactRouter.Route; var routes = require('../routes'); // -v x.13.x /**Router.run(routes, Router.HistoryLocation, function (Handler, state) { React.render( , document.getElementById('react-app')); });**/ var node = document.getElementById('react-app'); // -v 1.0.0 ReactDOM.render( , node);
Also as a heads up, I have tried uninstalling and reinstalling all my packages. I have tried installing specifically the node-libs-browser modules. thanks.