第一：
webpack只是构建
webpack-dev-server除了构建，还提供web服务
 
第二：webpack.config.json的路径参数
显然，entry都一样，因为都要知道需要构建的文件在哪里
那么区别就在于 output了
 
path和webpack一起，指明构建 之后 输出文件的位置，这是真实的物理地址
 
publickPath和webpack-dev-server一起，当执行webpack-dev-server时，第一步首先跟webpack一样，先构建输出，然后提供web访问，该输出文件是在内存中
默认情况下，不设置publicPath则输出文件默认在运行webpack-dev-server的目录，也就是根目录，，那么html中引用直接是src="输出的文件"，，如果设置了publicPath那么html中引用也要相对改变
 
 
总的来说，webpack只是构建，而webpack-dev-server相当于webpack+apache（或者其它web服务器）
区别在于
使用webpack+apache（或者其它服务器），每次构建之后，首先1 根据path引用构建后的输出文件；2 每次修改都要重新运行webpack
 
使用webpack-dev-server，运行之后首先1 先构建，输出文件在内存中，引用构建后的输出文件根据publicPath（默认是根目录）；2 每次修改，自动刷新

webpack和webpack-dev-server的区别的更多相关文章

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

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

  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. webpack 4 & dev server

    webpack 4 & dev server proxy https://webpack.js.org/configuration/dev-server/#devserverproxy htt ...

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

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

  6. Vue.js如何搭建本地dev server和json-server 模拟请求服务器

    前言:vue-cli(版本更新),由原来的2.8.1升级为2.9.1.主要改变是原来在build文件夹下的dev-server.js删掉了,增加了webpack.dev.conf.js. 所以这次讲的 ...

  7. Webpack学习-Webpack初识

    一.前言 webpack 到底是个什么东西呢,看了一大堆的文档,没一个能看懂的,因为上来就是给个module.exports 然后列一大堆配置,这个干啥,那个干啥,没一点用.但凡要用一个东西,一个东西 ...

  8. 从零开始配置webpack(基于webpack 4 和 babel 7版本)

    webpack 核心概念: Entry: 入口 Module:模块,webpack中一切皆是模块 Chunk:代码库,一个chunk由十多个模块组合而成,用于代码合并与分割 Loader:模块转换器, ...

  9. webpack入门——webpack的安装与使用

    一.简介 1.什么是webpack webpack是近期最火的一款模块加载器兼打包工具,它能把各种资源,例如JS(含JSX).coffee.样式(含less/sass).图片等都作为模块来使用和处理. ...

  10. webpack基础+webpack配置文件常用配置项介绍+webpack-dev-server

    一.webpack基础 1.在项目中生成package.json:在项目根目录中输入npm init,根据提示输入相应信息.(也可以不生成package.json文件,但是package.json是很 ...

随机推荐

  1. Linux学习十八之、善用判断式

    原文地址:http://vbird.dic.ksu.edu.tw/linux_basic/0340bashshell-scripts_3.php 善用判断式 在第十一章中,我们提到过 $? 这个变量所 ...

  2. vue+webpack一些知识

    使用mac的用户需要获取权限才可以使用npm install指令 设置node目录的权限指令 sudo chmod -R 777 /usr/local/lib/node_modules/ 大家都知道国 ...

  3. JavaScript之JSON

    一.简介:Json是JavaScript中读取结构化数据更好的方式.因为Json数据可以直接传给eval(),而且不必创建DOM对象.Json是一种数据格式,不是一种编程语言,虽然具有相同的语法形式, ...

  4. There is no result type defined for type 'json' mapped with name 'success'. Did you mean 'json'?

    错误信息: 严重: Exception starting filter struts2 Unable to load configuration. - action - file:/C:/Users/ ...

  5. CentOS启动报错：Centos kernel panic-not syncing:VFS:Unable to mount root fs on unknown block

    Centos kernel panic-not syncing:VFS:Unable to mount root fs on unknown block 原因:主要问题就是你更新了内核之后出现的问题. ...

  6. 网络分析shell脚本(实时流量+连接统计)

    介绍一个强大的分析网络的shell脚本,此脚本是从EZHTTP拆分出来的,觉得有必要单独介绍下.脚本运行效果截图: 此脚本包含的功能有: 1.实时监控任意网卡的流量 2.统计10秒内平均流量 3.统计 ...

  7. ecmall 点滴记录

    /* 取得列表数据 */ $model_wish =& m('wish'); $wish= $model_wish->find(array( 'conditions' => 'us ...

  8. JVM学习之JVM1.6 GC详解

    转自:http://www.cnblogs.com/ggjucheng/p/3977384.html,多谢分享 前言  JVM GC是JVM的内存回收算法,调整JVM GC(Garbage Colle ...

  9. linux系统find命令使用

    find命令简介 1.find的作用 find是个使用频率比较高的命令.常常用它在系统特定目录下,查找具有某种特征的文件. 2.    find命令的格式 find  [-path……]-option ...

  10. [剖析Javascript原理]1.原生数据类型

    一.原生数据类型 JS共有5种原生数据类型: Boolean true或者false String 字符串,在单引号或者双引号之间(不存在字符类型) Number 整数或者浮点数 Null 空 und ...