Description
- Operating System: Windows 10
- Node Version: v10.15.0
- NPM Version: v6.9.0
- webpack Version: 4.30.0
- webpack-dev-server Version: 3.3.2
- [x ] This is a bug
- This is a modification request
Code
// webpack.config.js
const path = require("path");
const webpack = require("webpack");
const Merge = require("webpack-merge");
var WebpackNotifierPlugin = require('webpack-notifier');
var HardSourceWebpackPlugin = require('hard-source-webpack-plugin');
const ScriptBundleDir = '/Scripts/bundles';
common = {
entry: {
'Controllers/Root/Ads/Index': './Scripts/Controllers/Root/Ads/Index.ts',
'Controllers/Root/BoxLeague/Create': './Scripts/Controllers/Root/BoxLeague/Create.ts',
// deleted 66 other entry points
},
target: "web",
resolve: {
// Add ".ts" and ".tsx" as resolvable extensions.
extensions: [".ts", ".tsx", ".js", ".json", ".html"],
modules: [path.resolve(__dirname, "Scripts"), "node_modules"]
},
module: {
rules: [
{
test: /.ts$/,
use: {
loader: "awesome-typescript-loader",
options: {
"configFileName": 'tsconfigWebpack.json',
useCache: true
}
}
},
{
enforce: "pre",
test: /\.js$/,
use: {
loader: "source-map-loader"
}
},
{
test: /\.html$/,
use: {
loader: "html-loader",
options: {
attrs: false,
minimize: true,
removeComments: false
}
}
},
{
test: /knockout-validation/,
sideEffects: true
},
{
test: /timezone-picker/,
sideEffects: true
}
]
},
plugins: [
new webpack.ProvidePlugin({
$: "jquery",
jQuery: "jquery",
"window.jQuery": "jquery",
ko: "knockout-validation"
}),
new webpack.NormalModuleReplacementPlugin(/^messenger$/, 'messenger-hubspot/build/js/messenger.js'),
new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
new webpack.HashedModuleIdsPlugin(),
new HardSourceWebpackPlugin()
],
watchOptions: {
aggregateTimeout: 200,
ignored: /node_modules/
},
// pretty terminal output
stats: {
colors: true,
entrypoints: false,
modules: false,
warningsFilter: (warning) => {
return /entrypoint size limit/.test(warning);
}
}
};
module.exports = Merge(CommonConfig, {
mode: "development",
devtool: "inline-source-map",
output: {
// I add in the .min so that I can see that it is minimized and bundled
filename: "[name].js",
chunkFilename: "[name].chunk.js",
// the output is going to into the /Scripts/bundles directory and then a tree structure under that
path: __dirname + ScriptBundleDir,
// Making sure the CSS and JS files that are split out do not break the template cshtml.
publicPath: 'http://10.211.55.6:8080/Scripts/',
// Defining a global var that can used to call functions from within ASP.NET Razor pages.
library: "Skycourt",
libraryTarget: "var"
},
plugins: [
new WebpackNotifierPlugin()
]
});Note that the above config is really split into common config (between dev and prod) and dev config. I merged them here to show the dev config that is driving WDS
My project is a .Net project so .Net is serving up the website, not WDS and that is the root of the problem, I think. Each .Net page has its own entry point that is being bundled
Expected Behavior
The site is being served on localhost:50447 but WDS is serving the JS files on localhost:8080.
I see a tone of these requests:
http://localhost:50447/sockjs-node/info?t=...
These should not be going to localhost:50447, they should be going to localhost:8080.
Actual Behavior
the sockjs-node request is being made to the web site web server rather than WDS.
At this point WDS is not able to talk with the client so all those great features are no longer working.
For Bugs; How can we reproduce the behavior?
you need a situation where you serve your web site from one server and WDS from another server (ie, port). It looks like it will happen all the time with this situation.