原文发表于我的技术博客

此文主要帮助大家解决 webpack-dev-server 启动后修改源文件浏览器不能自动刷新的问题。

原文发表于我的技术博客

1. webpack 不能热加载的问题

主要的问题是各个版本之间的兼容性问题,请在本地的项目配置文件 package.json 中直接拷贝下面的配置文件,然后完整删除 node_modules 文件夹后,在项目文件夹下执行 npm install 即可。注意 Mac 系统下需要在命令前加 sudo
安装完成后执行 webpack-dev-server --inline --hot 即可正常自动刷新了。

{% codeblock lang:js%}
{
"name": "10-03",
"version": "1.0.0",
"description": "",
"main": "root.js",
"scripts": {
"test": "echo "Error: no test specified" && exit 1"
},
"author": "",
"license": "ISC",
"dependencies": {
"antd": "^2.1.0",
"babel": "^5.8.23",
"babel-core": "^6.1.21",
"babel-loader": "^6.1.0",
"babel-plugin-react-html-attrs": "^2.0.0",
"babel-preset-es2015": "^6.24.0",
"babel-preset-react": "^6.23.0",
"babelify": "^7.3.0",
"css-loader": "^0.25.0",
"fetch": "^1.1.0",
"json-loader": "^0.5.4",
"react": "^15.3.2",
"react-dom": "^15.3.2",
"react-mixin": "^2.0.2",
"react-responsive": "^1.2.1",
"react-router": "^2.8.1",
"style-loader": "^0.13.1",
"webpack": "^1.13.2",
"webpack-dev-server": "^1.16.1"
},
"devDependencies": {
"babel-plugin-import": "^1.0.1"
}
}

{% endcodeblock %}

解决 webpack-dev-server 不能自动刷新的问题的更多相关文章

  1. 配置Webpack Dev Server 实战操作方法步骤

    本文摘要:配置 Webpack Dev Server 可以解决本地开发前端应用时,手动执行 webpack 命令或 yarn build 命令,再去浏览器中访问 dist/index.html 的麻烦 ...

  2. 笔记:配置 webpack dev server

    笔记:配置 webpack dev server 安装 webpack-dev-server 组件 配置 webpack.config.js 配置 增加 html-webpack-plugin 组件 ...

  3. [Webpack] Access Webpack Dev Server from Mobile Safari on an iPhone

    Testing your sites on mobile devices is a critical part of the development process. Webpack dev serv ...

  4. 解决windows文件夹不能自动刷新的问题

    我用的是win7系统,最近忽然发现我的文档文件夹里的文件不能自动刷新了,就是当剪切或删除某个文件后,文件夹里的文件没有变化,看起来文件还在原文件夹中,只有通过手动刷新后才能看到效果,该如何解决? 网上 ...

  5. webpack dev server 和 sublime text 配合时需要注意的地方

    参考:https://webpack.js.org/guides/development/ Adjusting Your Text Editor Some text editors have a &q ...

  6. webpack dev server 配置 启动项目报错Error: listen EADDRINUSE

    Error: listen EADDRINUSE 0.0.0.0:5601 它的意思是,端口5601被其他进程占用. 切换端口即可解决问题

  7. 解决eclipse 文件更新不自动刷新的问题

    打开eclipse 1. Window ===> Preferences ===> General ===> Workspace 2. 勾选 1> Refresh using ...

  8. 解决新版本webpack vue-cli生成文件没有dev.server.js问题

    新版本webpack生成的dev.server.js 在webpack.dev.conf.js中 webpack.dev.conf.js const axios = require('axios') ...

  9. webpack 之 webpack-dev-server自动刷新

    watch 首先介绍watch选项,参考这里.可实现相关源文件改变后自动更新bundle.js文件的功能.在配置文件中添加 watch:true 或执行 webpack -w,即可开启watch功能: ...

  10. 【webpack】-- 自动刷新

    前端需要频繁的修改js和样式,且需要根据浏览器的页面效果不断的做调整:而且往往我们的开发目录和本地发布目录不是同一个,修改之后需要发布一下:另外一点就是并不是所有的效果都可以直接双击页面就能看到,我们 ...

随机推荐

  1. [20171124]bbed的使用问题2.txt

    [20171124]bbed的使用问题2.txt --//bbed 是探究oracle数据块的好工具,有时候不用转储,直接可以它看oracle内部块的内部结构.--//在使用中要注意一些问题,昨天又犯 ...

  2. Java中当前对象引用

    题: 计算机画图时,有点的概念,每个点由它的横坐标x 和 纵坐标 y 描述. 写一个类. 求两个点之间的曼哈顿距离 = 横向距离 + 纵向距离 例如,一个点(0,0) 和另一个点(1,1)的曼哈顿距离 ...

  3. 第七章 Hyper-V 2012 R2 授权管理

    当企业或组织的规模越来越大时,维护某一项单独的应用可能会由特定的运维人员进行管理.考虑到安全风险的问题,一般特定的运维人员不会拥有域管理员权限.自 Windows Server 2012 开始,操作系 ...

  4. [Hive_add_2] Hive 数据类型

    Hive 数据类型 正常数据类型 # 整型,4个字节 int # 大整型,8个字节 bigint # 字符串,最大长度2G String 复杂数据类型 # 数组,相同类型元素的数组 array< ...

  5. SonarQube 配置 LDAP(AD域)

    安装插件 1.下载 LDAP Plugin 插件,地址:https://docs.sonarqube.org/display/SONARQUBE67/LDAP+Plugin2.将下载的插件,放到 SO ...

  6. MySQL客户端工具的选择

    最近因系统云化项目,学习使用MySQL集群,为了找一款顺手的mysql客户端,反复使用了多个工具,并筛选出一个自认为最满意的,在此分享. 先说我的选择:SQLyog. 尝试的客户端:Toad for ...

  7. navicat连接mysql时出现2003(10060)错误

    问题解决步骤: 参考http://jingyan.baidu.com/article/95c9d20dac9040ec4f75617a.html,发现是防火墙未关闭: 那么我们就有两种方法去解决了 关 ...

  8. Nginx使用教程(一):下载并编译安装Nginx

    安装依赖 <br\>我们已经选择下载程序源代码进行手动编译,而不是使用软件包管理器(如Yum,Aptitude或Yast)进行安装. 这个选择有两个原因. 首先,软件包可能不包含在您的Li ...

  9. web笔试

    类型判断用到哪些方法? typeof和instanceof 值类型和引用类型的区别? 根据 JavaScript中的变量类型传递方式,又分为值类型和引用类型,在参数传递方式上,值类型是按值传递,引用类 ...

  10. 23个Python爬虫开源项目代码

    今天为大家整理了23个Python爬虫项目.整理的原因是,爬虫入门简单快速,也非常适合新入门的小伙伴培养信心.所有链接指向GitHub,祝大家玩的愉快 1.WechatSogou [1]– 微信公众号 ...