webpack-dev-server

How to watch certain node_modules changes with webpack-dev-server

by

You can config in in webpack.config file or in WebpackDevServer option, to watch for changes also in node_modules (i think that by default webpack watching for changes in all files) https://webpack.js.org/configuration/watch/#watchoptions-ignored in the following example webpack ignored all changes in node_modules folder except specific module. watchOptions: { ignored: [ /node_modules([\\]+|\/)+(?!some_npm_module_name)/, /\some_npm_module_name([\\]+|\/)node_modules/ ] } ignored[0] = … Read more

Webpack-dev-server not bundling even after showing bundle valid message

by

I’ve got the issue resolved by myself. Silly as it sounds but the issue was with the publicPath under the output object. It should match the path property instead of just /build/, i.e., output: { path: path.join(__dirname, ‘build/js’), publicPath: ‘/build/js’, // instead of publicPath: ‘/build/’ filename: ‘[name].js’ },

Customise ng serve to proxy calls to /api?

by

You can indeed setup a proxy to backend with the angular cli, with the –proxy-config flag. Here is more or less a copy-paste from the documentation: Say we have a server running on http://localhost:3000/api and we want all calls to http://localhost:4200/api to go to that server. We create a file next to projects package.json called … Read more

Change hard coded url constants for different environments via webpack

by

You can store your API_URL in webpack config: // this config can be in webpack.config.js or other file with constants var API_URL = { production: JSON.stringify(‘prod-url’), development: JSON.stringify(‘dev-url’) } // check environment mode var environment = process.env.NODE_ENV === ‘production’ ? ‘production’ : ‘development’; // webpack config module.exports = { // … plugins: [ new webpack.DefinePlugin({ … Read more

Webpack Dev Server with NGINX proxy_pass

by

Proxy pass should be ip and port of your webpack-dev-server container and you need proxy_redirect off; location /sockjs-node { proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $remote_addr; proxy_set_header Host $host; proxy_pass http://node:8080; proxy_redirect off; proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection “upgrade”; } Also don’t forget to add poll to your webpack-dev middleware watchOptions: { aggregateTimeout: 300, … Read more

webpack.validateSchema is not a function

by

Looks like npm bug, since webpack-dev-server@2.1.0-beta.11 requires webpack@^2.1.0-beta.26 but npm failed to install it. The easiest way to avoid the issue without updating too much is to change dependency in package.json to “webpack-dev-server”: “2.1.0-beta.10”, Instead of something like “webpack-dev-server”: “^2.1.0-beta.9″, “^” char before version says “compatible with”. Removing it sticks to the version exactly. Don’t … Read more