Recently, I began developing a library in TypeScript to fetch data from an API and using Webpack as a bundler. The library needs to interact with different APIs for development, testing, and production environments, so I created various environment files that should be replaced by Webpack.
While I'm on Ubuntu 18.04, one of our developers working on the library is using Windows and noticed that the file replacement wasn't functioning correctly on his local machine.
Below is an excerpt from my GitHub repository's webpack.config.js:
const merge = require('webpack-merge');
const path = require('path');
// Common configuration object...
...
// Environment configurations...
...
module.exports = mode => {
// Logic for merging common and environment-specific configs...
};
And here is an example of the prod config file:
const CleanWebpackPlugin = require('clean-webpack-plugin');
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
const webpack = require('webpack');
// Production configuration with NormalModuleReplacementPlugin...
...
module.exports = {
// Prod config details...
};
I suspect that the issue does not lie with Webpack but rather how it's being used.
GitHub repo: https://github.com/ManticSic/normalModuleReplacmentPlugin-issue-windows
Run npm ci followed by npm run build (or npm run build-dev for dev env).
Look for the important details towards the end of line #1.
Expected output:
...,t.environment={bar:"Prod"}...Actual output on Windows:
...,t.environment={bar:"Normal"}...