webpack-dev-server 是生成在内存中的

本地开发：

index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>

hello, webpack
<script type="text/javascript" src="http://127.0.0.1:8080/bundle.js"></script>

</body>
</html>

webpack.config.js

const path = require('path');
const webpack = require('webpack');

module.exports = {
    entry: [
        'webpack-dev-server/client?http://127.0.0.1:8080', // 资源服务器地址
        'webpack/hot/only-dev-server',
        './app/main.js'
    ],
    output: {
        publicPath:"http://127.0.0.1:8080/",
        path:'./',
        filename:'bundle.js'
    },
    devServer:{
        historyApiFallback:true,
        hot:true,
        inline:true,
        progress:true,
    },
    plugins: [
        new webpack.DefinePlugin({
            'process.env.NODE.ENV': 'development' //设置环境变量为开发环境
        }),
        new webpack.HotModuleReplacementPlugin()
    ]
};

package.json{  "name": "webpack",

"version": "1.0.0",
  "description": "",
  "main": "webpack.config.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
　　 "start": "webpack-dev-server --inline --hot"

  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "path": "^0.12.7",
    "webpack": "^1.14.0",
    "webpack-dev-server": "^1.16.2"
  }
}

命令行执行：

webpack-dev-server --inline

webpack摸索（一）webpack-dev-server热模块替换的更多相关文章

  1. Webpack & The Hot Module Replacement热模块替换原理解析

    Webpack & The Hot Module Replacement热模块替换原理解析 The Hot Module Replacement(HMR)俗称热模块替换.主要用来当代码产生变化 ...

  2. Hot Module Replacement [热模块替换]

    安装了webpack-dev-server后 , 配置 "start": "webpack-dev-server" 然后运行 npm start 会开起一个we ...

  3. 前端技术之：webpack热模块替换（HMR）

    第一步:安装HMR中间件: npm install --save-dev webpack-hot-middleware   第二步:webpack配置中引入webpack对象     const we ...

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

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

  5. webpack摸索笔记

    上一个链接,入门webpack看这篇文章最好:https://segmentfault.com/a/1190000006178770 1.先安装好node 2.建个项目文件 3,.window+r,打 ...

  6. webpack中热模块更新

    Hot Module Replacement,热模块更新,很多时候会简写成HMR. "scripts": { "start": "webpack-de ...

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

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

  8. 笔记：配置 webpack dev server

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

  9. [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 ...

随机推荐

  1. vps_centos_7_系统环境常规配置备忘

    1.设置时区(东八区) 1> 选择亚洲东八区北京时间:tzselect (按照提示选择指定的序号直到北京时间) 2>替换时区文件 :cp /usr/share/zoneinfo/Asia/ ...

  2. MVC中RenderBody的工作原理

    A)什么是RenderBody  根据MSDN的解释(http://msdn.microsoft.com/query/dev10.query?appId=Dev10IDEF1&l=EN-US& ...

  3. java中注解的使用与实例(一)

    注解目前非常的流行,很多主流框架都支持注解,而且自己编写代码的时候也会尽量的去用注解,一时方便,而是代码更加简洁. 注解的语法比较简单,除了@符号的使用之外,它基本与Java固有语法一致.Java S ...

  4. CS0103: The name ‘Scripts’ does not exist in the current context解决方法

    转至:http://blchen.com/cs0103-the-name-scripts-does-not-exist-in-the-current-context-solution/ 更新:这个bu ...

  5. 【BFS】POJ 3414

    直达 -> POJ 3414 Pots 相似题联动–>HDU 1495 非常可乐 题意:两个壶倒水,三种操作,两个桶其中一个满足等于C的最少操作,输出路径.注意a,b互倒的时候能不能倒满, ...

  6. Day 1：学习Windows Phone 使用 SQLite

    private void move(string fn) { StreamResourceInfo sr = Application.GetResourceStream(new Uri(fn, Uri ...

  7. flash跨域访问，crossdomain.xml,error #2048

    最近遇到了flash的万年老梗,跨域访问的问题.之前一直没有处理过这类问题,是因为做项目的时候别人已经处理好了.真到自己遇到的时候,还是很费脑筋的. 1遇到的问题 客户端发布到网页的时候,socket ...

  8. Rust语言的多线程编程

    我写这篇短文的时候,正值Rust1.0发布不久,严格来说这是一门兼具C语言的执行效率和Java的开发效率的强大语言,它的所有权机制竟然让你无法写出线程不安全的代码,它是一门可以用来写操作系统的系统级语 ...

  9. 使用js_md5加密密码

    为什么在传输过程中要用md5对密码进行加密? 众所周知,我们在表单中的输入框输入了密码后,如果采用ajax的post或者get方式提交数据,在浏览器的newwork中就可以看到我们向后台传输的内容,其 ...

  10. Salesforce练习Case

    以下几个SFDC的Case基本覆盖了Force.com平台的一些基本操作流程,大家可以自己动手练习一下 Case 1: 在某公司的业务流程中,有零售店和销售人员两类信息,销售人员是指在零售店中工作的人 ...