I use webpack dev server, but can't access my bundle.js file.
Edit: I am using this webpack config without bower-webpack-plugin.
package.json
{ "name": "react_modules", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "start": "npm run serve | npm run dev", "serve": "./node_modules/.bin/http-server -p 8080", "dev": "webpack-dev-server -d --progress --colors --port 8090" }, "author": "", "license": "ISC", "devDependencies": { "babel-core": "^6.0.20", "babel-loader": "^6.0.1", "babel-preset-es2015": "^6.0.15", "bootstrap": "^3.3.5", "bower-webpack-plugin": "^0.1.9", "css-loader": "^0.21.0", "events": "^1.1.0", "extract-text-webpack-plugin": "^0.9.0", "file-loader": "^0.8.4", "history": "^1.13.0", "http-server": "^0.8.5", "jquery": "^2.1.4", "jquery-ui": "^1.10.5", "json-markup": "^0.1.6", "jsx-loader": "^0.13.2", "less": "^2.5.3", "less-loader": "^2.2.1", "lodash": "^3.10.1", "node-sass": "^3.4.1", "object-assign": "^4.0.1", "path": "^0.12.7", "react": "^0.14.2", "react-dom": "^0.14.2", "react-hot-loader": "^1.3.0", "react-router": "^1.0.0-rc4", "sass-loader": "^3.1.1", "style-loader": "^0.13.0", "svg-sprite-loader": "0.0.11", "url-loader": "^0.5.6", "webpack": "^1.12.2", "webpack-dev-server": "^1.12.1" } } webpack.config.js
const BowerWebpackPlugin = require("bower-webpack-plugin"); module.exports = { entry: './src/index.jsx', output: { filename: 'bundle.js', sourceMapFilename: "[file].map", publicPath: 'http://localhost:8090/assets' }, debug: true, devtool: 'inline-source-map', module: { loaders: [ { test: /\.js[x]?$/, loaders: ['react-hot', 'babel'], exclude: /node_modules/ }, { test: /\.scss$/, loaders: [ 'style', 'css?sourceMap', 'sass?sourceMap' ] }, { test: /\.less$/, loaders: [ 'style', 'css?sourceMap', 'less?sourceMap' ] }, { test: /\.css$/, loaders: [ 'style', 'css'] }, { test: /\.woff$/, loader: "url-loader?limit=10000&mimetype=application/font-woff" }, { test: /\.woff2$/, loader: "url-loader?limit=10000&mimetype=application/font-woff2" }, { test: /\.(eot|ttf|svg|gif|png)$/, loader: "file-loader" } ] }, plugins: [ new BowerWebpackPlugin() ], resolve: { extensions: ['', '.js', '.jsx'] } }; index.html
<!DOCTYPE html> <html> <head> <title>App</title> </head> <body> <div id="content"> <!-- this is where the root react component will get rendered --> </div> <!-- include the webpack-dev-server script so our scripts get reloaded when we make a change --> <!-- we'll run the webpack dev server on port 8090, so make sure it is correct --> <script src="http://localhost:8090/webpack-dev-server.js"></script> <!-- include the bundle that contains all our scripts, produced by webpack --> <!-- the bundle is served by the webpack-dev-server, so serve it also from localhost:8090 --> <script type="text/javascript" src="http://localhost:8090/assets/bundle.js"></script> </body> </html> console output
and:react_modules and$ npm run start > react_modules@1.0.0 start /Users/and/devel/react_modules > npm run serve | npm run dev > react_modules@1.0.0 dev /Users/and/devel/react_modules > webpack-dev-server -d --progress --colors --port 8090 0% compilehttp://localhost:8090/webpack-dev-server/ webpack result is served from http://localhost:8090/assets content is served from /Users/and/devel/react_modules Hash: dd2f28f3fef16a34048b Version: webpack 1.12.2 Time: 612ms ERROR in ./src/index.jsx Module build failed: SyntaxError: /Users/and/devel/react_modules/src/index.jsx: Unexpected token (5:2) 3 | 4 | ReactDOM.render( > 5 | <h1>Hello, world!</h1>, | ^ 6 | document.getElementById('content') 7 | ); 8 | at Parser.pp.raise (/Users/and/devel/react_modules/node_modules/babel-core/node_modules/babylon/lib/parser/location.js:24:13) at Parser.pp.unexpected (/Users/and/devel/react_modules/node_modules/babel-core/node_modules/babylon/lib/parser/util.js:91:8) at Parser.pp.parseExprAtom (/Users/and/devel/react_modules/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:507:12) at Parser.pp.parseExprSubscripts (/Users/and/devel/react_modules/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:260:19) at Parser.pp.parseMaybeUnary (/Users/and/devel/react_modules/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:240:19) at Parser.pp.parseExprOps (/Users/and/devel/react_modules/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:171:19) at Parser.pp.parseMaybeConditional (/Users/and/devel/react_modules/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:153:19) at Parser.pp.parseMaybeAssign (/Users/and/devel/react_modules/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:120:19) at Parser.pp.parseExprListItem (/Users/and/devel/react_modules/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:966:16) at Parser.pp.parseCallExpressionArguments (/Users/and/devel/react_modules/node_modules/babel-core/node_modules/babylon/lib/parser/expression.js:336:20) webpack: bundle is now VALID. When I run dev server, I get 404 Not Found http://localhost:8090/assets/bundle.js