第一：
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. 网易云课堂_程序设计入门-C语言_第四周：循环控制_1素数和

    1 素数和(5分) 题目内容: 我们认为2是第一个素数,3是第二个素数,5是第三个素数,依次类推. 现在,给定两个整数n和m,0<n<=m<=200,你的程序要计算第n个素数到第m个 ...

  2. dog-fooding-our-api-authentication

    Dog-fooding our API - Authentication http://blog.mirajavora.com/authenticate-web-api-using-access-to ...

  3. Dell 2950服务器CPU-E1422错误解决方法

    .造成原因:CPU松动或者是硅胶损耗 .解决方法: .断掉电源,将其后盖打开(在手没有静电的情况下操作) .拔掉周围的排热扇 .按住关卡,将其CPU卸下:并使用清洁剂清理,再次给CPU上涂上硅胶(均匀 ...

  4. mysql安装常见问题（系统找不到指定的文件、发生系统错误 1067 进程意外终止）

    在安装mysql时总是会遇到这样那样的问题,每次重新安装都会花很多时间来排查.在网上其实有很多相关的文章,但很多都只讲了方法,但没讲具体细节问题,导致无法解决问题.其实有时候知道问题的原因,但总是因为 ...

  5. 状态压缩DP------学习小记

    状态DP主要用的还是DP思想,顾名思义,加了一个状态,主要是用来求状态个数的. 状态是用二进制数来表示的,也就是用0或1来表示,每一行有一个状态数,就是由这一行的0或1组成的,首先我们要获得每行的状态 ...

  6. submit与onsubmit（转）

    发生顺序:onsubmit -> submit 1.阻止表单提单: <script>function submitFun(){    //逻辑判断    return true; / ...

  7. Flink资料（2）-- 数据流容错机制

    数据流容错机制 该文档翻译自Data Streaming Fault Tolerance,文档描述flink在流式数据流图上的容错机制. ------------------------------- ...

  8. Android IT资讯网络阅读器应用源码

    这个是Android IT资讯网络阅读器应用,也是一款通过jsoup解析Html获取内容的网络阅读器,和前面的其实是类似的,也是大学时期闲暇完成,对照CSDN的Web页面元素设计进行解析提取内容,核心 ...

  9. [LeetCode]题解（python）：010-Regular Expression Matching

    题目来源: https://leetcode.com/problems/regular-expression-matching/ 题意分析: 这道题目定义了两个正则表达式规则.’.’代表任意字符,’* ...

  10. Html 笔记1

    标题(Heading)是通过 <h1> - <h6> 等标签进行定义的. <h1>这是标题</h1> 段落是通过 <p> 标签进行定义的. ...