为什么在代码更改时我的Webpack块不更新?

时间:2020-04-17 13:38:22

标签: javascript webpack

当我更改文件中的代码时,更改不会反映在Webpack版本3.12.0生成的块中。

这是我的webpack.config

const path = require("path");

module.exports = {
  entry: {
    app_main: "./src/app-main.js",
    serviceworker: "./src/serviceworker.js"
  },
  output: {
    path: path.resolve(__dirname, "static/js"),
    filename: "[name].bundle.js",
    chunkFilename: "[name].bundle.js",
    publicPath: "/static/js/"
  },
  devtool: "inline-source-map"
};

这是主要的js文件

const routes = [
    {
      uri: "/app/",
      module: "app-index"
    },
    {
      uri: "/app/list/",
      module: "app-list"
    }
  ],
  mountElement = document.querySelector("main");

const loadpath = (path, elm) => {
  let route = routes.find(r => r.uri === path);
  // console.log("loading", route);
  import(/* webpackChunkName: `${route.module}` */ `./${route.module}`).then(
    mod => (mountElement.innerHTML = mod.default())
  );
};

const addListener = (rootElm, sel, func) => {
  rootElm.addEventListener("click", e => {
    if (e.target.tagName.toLowerCase() === sel) {
      func(e);
    }
  });
};

document.addEventListener("DOMContentLoaded", e => {
  const path = location.pathname;

  loadpath(path, mountElement);

  addListener(document.querySelector("main"), "a", e => {
    console.log(e);
    history.pushState(
      {},
      e.target.pathname,
      location.origin + e.target.pathname
    );
    loadpath(e.target.pathname, mountElement);
    e.preventDefault();
  });
});

window.onpopstate = () => {
  loadpath(window.location.pathname, mountElement);
};

app-list.js文件的内容

const render = () => `<a href="/app/list/">Link 1</a>`;
export default render;

app-index.js文件的内容

const render = () => `<a href="/app/">Go to app</a>`;
export default render;

现在,如果我对

这样的app-index.js进行简单的更改,
const render = () => `<a href="/app/list/">Link 2</a>`;
export default render;

我看到webpack正在承担更改,我正在工作时正在运行webpack --w,我在终端中看到了

Hash: fb486c0672ca68904ab5
Version: webpack 3.12.0
Time: 22ms
      Asset     Size  Chunks             Chunk Names
9.bundle.js  1.36 kB       9  [emitted]  
 + 11 hidden assets
   [9] ./src/app-index.js 262 bytes {9} [optional] [built]
  [17] ./src lazy ^\.\/.*$ 160 bytes {10} [built]
    + 56 hidden modules

但是现在当我重新加载页面时,没有变化可见,输出也没有更新。在Chrome中进行强制重新加载,但没有任何反应。

我想念什么?

0 个答案:

没有答案