Angular Web包开发服务器提供一个旧版本包

我正在使用Webpack构建Angular 2 AOT应用程序（请参见下面的配置）。当我刚刚运行

webpack

时，一切正常。当我使用

webpack-dev-server

时，它在第一次加载页面时运行良好，但从那时起，捆绑包始终是一个旧版本

例如，当我使用包含

hello

的角度组件模板启动服务器时，我看到了预期的“hello”。然后，当我将模板更改为

hello world

时，页面会重新加载，但仍然只显示“hello”（控制台显示

[WDS]没有任何更改。

）当我再次将模板更改为

bye world

时，页面会重新加载，但会显示“hello world”，就像上次重新加载时一样

这种延迟不会发生在

index.html

（即使我使用的是

html网页包插件

）上，只会发生在TypeScript文件和角度模板（编译为TypeScript文件）上。这种情况在

webpack--watch

中也不会发生，仅在

webpack dev server中发生

我的
webpack.config.js
：

const webpack = require("webpack");
const ngToolsWebpack = require("@ngtools/webpack");
const HtmlWebpackPlugin = require("html-webpack-plugin");

module.exports = {
    entry: {
        app: "./src/main.ts",
        vendor: ["@angular/core", "@angular/common", "@angular/platform-browser"],
        polyfill: ["zone.js/dist/zone.js"],
    },
    output: {
        path: __dirname + "/dist",
        filename: "[name].js",
    },

    resolve: {
        extensions: [".ts", ".js"],
    },

    module: {
        rules: [
            { test: /\.html$/, use: "raw-loader" },
            { test: /\.css$/, use: "raw-loader" },
            { test: /\.ts$/, use: "@ngtools/webpack" },
        ],
    },

    plugins: [
        new ngToolsWebpack.AotPlugin({
            tsConfigPath: "./tsconfig.json",
        }),
        new webpack.optimize.CommonsChunkPlugin({
            names: ["vendor", "polyfill"],
        }),
        new HtmlWebpackPlugin({
            template: "src/index.html",
        }),
    ],
};

您是否尝试过添加
chunkhash

const webpack = require("webpack");
const ngToolsWebpack = require("@ngtools/webpack");
const HtmlWebpackPlugin = require("html-webpack-plugin");

module.exports = {
    entry: {
        app: "./src/main.ts",
        vendor: ["@angular/core", "@angular/common", "@angular/platform-browser"],
        polyfill: ["zone.js/dist/zone.js"],
    },
    output: {
        path: __dirname + "/dist",
        filename: "[name].[chunkhash].js",
    },

    resolve: {
        extensions: [".ts", ".js"],
    },

    module: {
        rules: [
            { test: /\.html$/, use: "raw-loader" },
            { test: /\.css$/, use: "raw-loader" },
            { test: /\.ts$/, use: "@ngtools/webpack" },
        ],
    },

    plugins: [
        new ngToolsWebpack.AotPlugin({
            tsConfigPath: "./tsconfig.json",
        }),
        new webpack.optimize.CommonsChunkPlugin({
            names: ["vendor", "polyfill", "manifest"],
        }),
        new HtmlWebpackPlugin({
            template: "src/index.html",
        }),
    ],
};

希望这有帮助。
您是否尝试过添加
chunkhash

const webpack = require("webpack");
const ngToolsWebpack = require("@ngtools/webpack");
const HtmlWebpackPlugin = require("html-webpack-plugin");

module.exports = {
    entry: {
        app: "./src/main.ts",
        vendor: ["@angular/core", "@angular/common", "@angular/platform-browser"],
        polyfill: ["zone.js/dist/zone.js"],
    },
    output: {
        path: __dirname + "/dist",
        filename: "[name].[chunkhash].js",
    },

    resolve: {
        extensions: [".ts", ".js"],
    },

    module: {
        rules: [
            { test: /\.html$/, use: "raw-loader" },
            { test: /\.css$/, use: "raw-loader" },
            { test: /\.ts$/, use: "@ngtools/webpack" },
        ],
    },

    plugins: [
        new ngToolsWebpack.AotPlugin({
            tsConfigPath: "./tsconfig.json",
        }),
        new webpack.optimize.CommonsChunkPlugin({
            names: ["vendor", "polyfill", "manifest"],
        }),
        new HtmlWebpackPlugin({
            template: "src/index.html",
        }),
    ],
};

希望这能有所帮助。
这不会改变任何事情-我尝试过刷新浏览器、禁用其缓存等。但似乎断开连接的不是浏览器和服务器，而是服务器和版本。我只是分享了对我有用的东西。上次我也有同样的问题。不过你可以试试。但这就是我的案例的运作方式。我确实尝试过——并不是故意让它听起来像我只是在否定这个想法。我同意。我认为服务器和构建之间存在某种联系。这不会改变任何事情-我尝试过刷新浏览器、禁用其缓存等。但似乎断开连接的不是浏览器和服务器，而是服务器和构建。好吧，我只是分享了对我有用的东西。上次我也有同样的问题。不过你可以试试。但这就是我的案例的运作方式。我确实尝试过——并不是故意让它听起来像我只是在否定这个想法。我同意。我认为服务器和构建之间存在某种联系。