如何保存对webpack开发服务器的修改？
要保存对webpack开发服务器的修改，可以按照以下步骤进行操作：
- 在webpack配置文件中，找到devServer字段，该字段用于配置开发服务器的相关选项。
- 在devServer字段中，找到hot字段，将其设置为true。这将启用热模块替换（Hot Module Replacement，HMR）功能，使得在修改代码后，浏览器可以自动刷新并加载最新的修改。
- 在devServer字段中，找到contentBase字段，将其设置为需要保存修改的文件所在的目录。这样，当文件发生修改时，webpack开发服务器会自动重新编译并刷新浏览器。
- 在终端中运行webpack开发服务器命令，例如使用webpack-dev-server命令启动开发服务器。
- 在浏览器中访问开发服务器的URL，即可开始开发和修改代码。
- 当需要保存对webpack开发服务器的修改时，只需在编辑器中修改相应的文件，并保存修改。webpack开发服务器会自动检测到文件的修改，并重新编译并刷新浏览器。
需要注意的是，以上步骤是基于使用webpack-dev-server作为开发服务器的情况。如果使用其他开发服务器，可能会有略微不同的配置方式。此外，为了更好地保存修改，建议使用版本控制系统（如Git）来管理代码，以便可以随时回滚到之前的版本。
相关·内容
5回答
如何禁用webpack开发服务器自动重装？
webpack、webpack-dev-server
我知道大多数人都有相反的问题，但我实际上想禁用自动重新加载功能。
下面是我运行服务器的方式：
webpack-dev-server --open --progress
这是我的开发服务器配置：
devServer: {
contentBase: 'app',
port: 9005,
hot: false,
inline: false
}
版本：
"webpack": "1.14.0",
"webpack-dev-middleware": "1.9.0",
"webpack-d
浏览 2提问于2017-01-23得票数 44
3回答
Webpack - [HMR]和[WDS]发射两次
javascript、webpack、webpack-dev-server、webpack-hmr
我在开发工具控制台中两次收到类似[HMR] Waiting for update signal from WDS...和[WDS] Hot Module Replacement enabled.的消息。为什么会这样呢？我做错了什么吗？ ? 我的webpack.config.js文件： ...
module.exports = () => {
return {
entry: {
bundle: './src/app/App.jsx',
sw: './src/app/sw.js
浏览 88提问于2019-01-07得票数 24
14回答
Webpack-dev-server编译文件，但不刷新或使已编译javascript可供浏览器使用。
javascript、webpack、vue.js、webpack-dev-server
我正在尝试使用webpack开发服务器来编译文件并启动一个dev web服务器。
在我的package.json中，脚本属性设置为：
"scripts": {
"dev": "webpack-dev-server --hot --inline",
}
因此，--hot和--inline应该启用and服务器和热重载(据我理解)。
在我的webpack.config.js文件中，我设置了条目、输出和devServer设置，并添加了一个加载程序来查找.vue文件中的更改：
module.exports = {
entry: './
浏览 11提问于2016-03-16得票数 100
回答已采纳
2回答
Webpack hmr:未找到__webpack_hmr 404
webpack、webpack-dev-server
我正在使用webpack-dev-server进行热模块替换。它工作得很好，但是这个错误每隔几秒钟就会在控制台中出现：GET http://mysite:8080/__webpack_hmr 404 (Not Found)。
这是我的webpack.config.js：
var webpack = require('webpack'),
hostname = 'mysite',
port = 8080;
module.exports = {
entry: [
'babel-polyfill',
浏览 5提问于2016-12-27得票数 27
回答已采纳
1回答
Webpack 4 devServer HMR加上对其他文件更改的完全重新加载(如视图)
node.js、webpack、browser-sync、livereload、webpack-serve
我有一个具有工作Webpack4配置的web项目，它使用webpack-dev-server并启用HMR，并通过npm脚本以这种方式启动：
cross-env NODE_ENV=development webpack-dev-server --inline --hot
一切都好，HMR为我的js和scss文件工作。现在我在想，当我修改一个视图模板文件时，是否可以扩展我的Webpack配置，使浏览器中有一个完整的重新加载。
对我来说，webpack-dev-server自己做不到这一点，所以我想我需要一些其他插件。在谷歌上搜索了一下之后，我得到了：
+
将我的配置重写为，就像它看起来
浏览 3提问于2018-09-13得票数 4
回答已采纳
1回答
Webpack-开发-服务器不显示更改中的最新文件
javascript、webpack、webpack-dev-server
我正在尝试运行一个项目，该项目使用具有HMR和源映射的webpack开发服务器，但遇到了一个问题。当我单独使用带有配置文件的webpack时，控制台输出中将显示源代码映射，并且HMR在页面刷新时工作，但没有服务器。当我尝试使用webpack-dev-server运行脚本时，控制台中没有指示正在生成源代码映射，并且当重新编译出现在控制台输出中时，更改不会呈现(无论是自动还是在页面刷新时)。
这是我的配置文件
/*
Webpack Configuration File
webpack.config.js
===
Webpack configuration file
浏览 13提问于2018-01-18得票数 4
回答已采纳
2回答
开发服务器没有热重新加载，生成失败
webpack、webpack-dev-server、react-hot-loader、hapi.js
我正在开发一个react/redux应用程序，在本地使用npm管道的hapi.js后端:3000，以及运行在端口3001上的webpack开发服务器；
我在返回上有几个api路由来提供静态文件，然后使用{param*}规则从构建/公共目录中访问资产文件。为此，我在WebpackDevServer上有一个代理，它将请求转发回端口:3000
我让CSSModules执行.scss的构建，还有其他几个加载器已经就绪。
当我第一次设置它时，它就像预期的那样工作了。我可以添加文件，保存内容，执行构建，HMR将完成它的工作，并更新dom。效果很好。在某种程度上，这是停止了很好的工作。后端on :3000进
浏览 7提问于2016-06-23得票数 0
回答已采纳
3回答
如何在每次保存后自动运行Webpack-dev-server？
javascript、reactjs、web、webpack、webpack-dev-server
当我使用Atom的AutoSave OnChange包运行我的应用程序时，我想要自动运行和自动刷新webpack-dev-server。 我的webpack-dev-server是： devServer: {
contentBase: './src/index.js',
host: '0.0.0.0',
compress: true,
port: 3001, // port number
historyApiFallback: true,
quiet: true,
浏览 39提问于2019-03-08得票数 1
回答已采纳
1回答
热模块替换HMR找不到更新。需要做一个充分的重新装载！创建反应应用程序和电子
webpack、electron、webpack-dev-server、create-react-app、hot-module-replacement
我使用电子和我有一个弹射创建反应应用webpack配置。我启用了热模块替换。
热更新是生成的，在我看到的终端中，例如5f4dde8b4941bfe36ef8.hot-update.json，，但是客户端似乎找不到这些更新
知道如何调试或修复此问题吗？
我怀疑客户试图寻找更新的路径是错误的。
在客户端控制台中，我可以看到：
[HMR] Waiting for update signal from WDS...
[WDS] Hot Module Replacement enabled.
[WDS] App updated. Recompiling...
[WDS] App hot update..
浏览 0提问于2018-07-12得票数 0
2回答
清单请求中的Webpack HMR超时
webpack、webpack-dev-server
我想在我的React应用中使用Webpack HMR。我的webpack配置是这样的：
var path = require('path');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var StyleLintPlugin = require('stylelint-webpack-plugin');
var webpack = require('webpack');
var extractScss = new ExtractTextPlugi
浏览 0提问于2017-06-09得票数 4
2回答
Webpack热模块替换不注入更新代码
webpack-dev-server、webpack-2、webpack-hmr
我一直在尝试配置Webpack 2热模块替换，使用Webpack-Dev-服务器.
webpack.config.js如下：
const path = require('path');
const Webpack = require('webpack');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const HotModuleReplacement = new Webpack.HotModuleReplacementPlugin();
浏览 4提问于2017-03-06得票数 1
1回答
在使用具有HMR配置的webpack-dev-server时无法加载图像。
reactjs、webpack、webpack-dev-server、webpack-hmr
我用webpack2创建了一个React项目，并使用webpack开发服务器预览了结果.首先，我使用CLI来启用HMR，如下所示：
webpack-dev-server --inline --hot
一切都很好。
然后，我想通过设置webpack.config.js来启用HMR，但是失败了。浏览器没有显示图像，控制台总是显示404错误，如下所示：
我一整天都在寻找这些方法，并多次更改了配置文件，但是没有什么不同。任何帮助都是非常感谢的。
我的项目结构：
|--dist
| |--index.html
|--src
| |--images
| | |--logo.png
| |--j
浏览 1提问于2017-06-09得票数 0
回答已采纳
5回答
Webpack:如何使用webpack-dev-server在磁盘上编译、写入和服务静态内容(js/css)
javascript、node.js、reactjs、webpack、ecmascript-6
我想构建我的js/css代码，把它写在磁盘上，并在一个命令中使用webpack-dev服务器提供服务。我不想为生产模式设置另一台服务器。我们该怎么做？共享下面的webpack.config.js文件内容：
module.exports = {
watch: true,
entry: [
'./src/index.js'
],
output: {
path: __dirname +'/dist/',
publicPath: '/dist/',
filename: 'bundle.js'
},
modu
浏览 3提问于2017-01-30得票数 34
回答已采纳
2回答
不能让Webpack 2 HMR对工作做出反应
reactjs、webpack、webpack-dev-server、webpack-hmr、hot-module-replacement
目前，我正在努力使HMR工作在我的Webpack 2设置。我会解释我的整个设置，所以我希望这足以让人了解发生了什么。
我的项目结构：
config
dev.js
prod.js
dist
css
js
index.html
node_modules
src
components
// some JavaScript components
shared
stylesheets
index.js
.babelrc
package.json
webpack.config.js
这是我的webpack.config.js文件的内容，放在我的项目的根目录中：
浏览 9提问于2017-04-19得票数 3
回答已采纳
3回答
Webpack开发服务器热模式不起作用
javascript、webpack、webpack-dev-server
下面是我的配置：
devServer: {
contentBase: '/web/dist/',
hot: true,
stats: {colors: true},
inline: true
}
下面是我正在运行的吞咽任务：
gulp.task('build', ['clean', 'styles', 'bower', 'media', 'data', 'homepage'], function(done) {
es6promi
浏览 0提问于2015-05-29得票数 6
回答已采纳
2回答
React & Webpack开发服务器:热重装无法工作
javascript、reactjs、webpack、webpack-dev-server
我有一个反应应用程序与一个相当简单的Webpack设置，我想使用Webpack开发服务器，并启用热重加载。我好像读过解决这个问题的所有答案.
package.json
"dev": "NODE_ENV=dev webpack-dev-server --hot --inline --open --progress --mode development --content-base dist --config webpack.dev.js",
webpack.common.js
devtool: "source-map",
entry: [
浏览 0提问于2018-06-14得票数 0
1回答
为什么webpack-dev-server需要内联和热标志才能启用热重加载
webpack、webpack-dev-server、webpack-hmr
在或文章中，我看到用webpack开发服务器启用HMR，我们需要使用webpack-dev-server --hot --inline，即使我省略了hot标志，并且只保留在代码基HMR中的inline仍然有效。所有的文件都是旧的还是我做错了？
我不会在webpack配置中定义任何devServer选项，这是我的web包配置
module.exports = {
entry: {
main: "./app/main.ts",
shims: ['es6-shim', 'reflect-metadata', 'rxj
浏览 5提问于2016-05-24得票数 3
回答已采纳
1回答
hot + Webpack HMR正在刷新页面(不是热加载)
javascript、reactjs、webpack、webpack-dev-server、react-hot-loader
我遇到了一些麻烦，让反应热烈的webpack装载机正确工作。
当我加载页面时，正如我所期望的那样，我得到了以下内容：
等待来自WDS的更新信号..。
启用热模块替换。
但是，当我保存更改时，页面会自动艰难地刷新浏览器(而不是HMR替换)。
//webpack.config.js
{
entry: {
client: 'webpack-dev-server/client?http://localhost:8786', // WebpackDevServer host and port
app: "./HelloWorld.tsx"
浏览 0提问于2016-05-17得票数 16
回答已采纳
1回答
Webpack怎么配置？
javascript、web、npm、webpack、development-environment
我需要编一本书和玉石。
我为sass找到了一个选择，但不起作用。只在启动时编译。
我试过以下命令：
webpack-开发服务器-手表-投票
webpack开发服务器
-观看webpack-开发服务器
但是它只在这样一个命令之后编译：
webpack
const path = require('path');
const webpack = require('webpack');
module.exports = {
entry: './src/index.js',
浏览 2提问于2017-07-20得票数 1
1回答
Webpack热装载机偶尔会检测到所做的更改。
reactjs、webpack
在过去的几天里，我一直在和Webpack打交道。我好像把它按我想要的方式工作了。但是，在Windows 7上，当我对文件进行更改时，脚本不会启动另一个重新编译。当我测试时，在mac上似乎工作得很好。
webpack.config.js
var webpack = require('webpack');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
module.exports = {
entry: [
'webpack-dev-server/cli
浏览 2提问于2016-07-18得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
活动推荐
腾讯云开发者
