这是我刚创建的一个仓库,用于解决此问题:https://github.com/DevCubeHD/WebpackStaticPage
首先:文件结构。如果您不习惯使用示例,则应该了解两个重要的文件夹。默认情况下,/src
文件夹是所有原始内容所在的位置,而/dist
文件夹是打包的网站所在的位置。从那里可以在任何服务器上进行部署。我不确定开发是否仍然需要此目录,但我希望您是这样。
我正在尝试为生产和开发设置两个Webpack脚本。
生产工作正常:脚本运行得很顺利,页面已放入/dist
。
在开发中,我想使用webkit hotloader在刚进行一些更改时立即将更改应用于页面。它确实运行并且输出看起来非常好,但是当涉及到页面时,它卡在[WDS] App hot update...
上,并且不更新内容。即使刷新页面后,内容仍旧。唯一有帮助的是运行生产脚本。
要运行开发脚本,请使用yarn start
或npm run start
。对于全新的/dist
目录,您现在可以使用生产脚本yarn build
或npm run build
。
请帮助我修复webback-dev-server,以便我高效地进行开发。 :)非常感谢!
答案 0 :(得分:0)
您应该使用HotModuleReplacementPlugin
中的webpack
。
plugins: [
new webpack.HotModuleReplacementPlugin()
]
答案 1 :(得分:0)
我可以通过执行以下操作来实现这一目标,
main.js
和main.less
,并且只有index.html
HotModuleReplacementPlugin
assets
文件夹,并将所有文件放在一个文件夹中。