本文所用webpack版本为4+,阅读本章的同学请注意区分。

webpack默认不需要配置文件 但是你仍可在项目的node_module目录同级目录建立一个webpack.config.js文件进行配置

本人的苦逼经历觉得这句话还是挺重要的,所以开局先一句话,

本章主要介绍webpack 的devserver配置项,请根据自身判断是否需要继续阅读

上代码

module.exports = {
entry: {
// ...
},
output: {
// ...
publicPath: "./",//为什么把这个字段列出来呢,下面会有解释
},
devServer: {
contentBase: '/index.html',//设置 publicPath: "",//设置访问地址,在开启服务之后会出现一个访问地址,一般都是 http://localhost:8080/,如果你把这个值设置成/index,这里是需要加/符号的。那么你开启的服务的访问打地址就是 http://localhost:8080/index //...
//本项中上面两项配置是有坑的,特别是对新手来说,而且他的配置,大体上通过翻阅webpack配置文旦就可里顺利的调用,所以就不再叙述
//devserver中还有很多配置选项,想要详细了解可以访问https://www.webpackjs.com/configuration/dev-server/#devserver-host
}
}

webpack devServer配置项的坑的更多相关文章

  1. 深入浅出的webpack构建工具---DevServer配置项(二)

    深入浅出的webpack构建工具---DevServer配置项(二) 阅读目录 DevServer配置项 1. contentBase 2. port 3. host 4. headers 5. hi ...

  2. 基于 Laravel 开发 ThinkSNS+ 中前端的抉择(webpack/Vue)踩坑日记【ThinkSNS+研发日记系列】

    在上一篇文章< ThinkSNS+基于Laravel master分支,从1到 0,再到0.1>,简单的介绍了 社群系统ThinkSNS+ ,这里分享在开发过程中,前端选择的心理活动. L ...

  3. 基于 Laravel 开发 ThinkSNS+ 中前端的抉择(webpack/Vue)踩坑日记

    在上一篇文章< ThinkSNS+基于Laravel master分支,从1到 0,再到0.1>,简单的介绍了 ThinkSNS+ ,这里分享在开发过程中,前端选择的心理活动. Larav ...

  4. 跨域解决方案 - webpack devServer

    1. 定义 如果一个项目中配置了webpack, 那么我们使用 webpack devServer 来配置代理转发请求来达到解决跨域问题的目的 webpack devServer 能够解决跨域问题的根 ...

  5. [问题记录] webpack devServer HtmlWebpackPlugin 没有加载 js、css

    webpack devServer 没有加载 js.css HtmlWebpackPlugin runtimeChunks 注入问题. 描述 写了一个极其简单的多页面 demo 启动开发服务器,发现样 ...

  6. express:webpack dev-server中如何将对后端的http请求转到https的后端服务器中?

    在上一篇文章(Webpack系列:在Webpack+Vue开发中如何调用tomcat的后端服务器的接口?)我们介绍了如何将对于webpack-dev-server的数据请求转发到后端服务器上,这在大部 ...

  7. express:webpack dev-server开发中如何调用后端服务器的接口?

    开发环境:     前端:webpack + vue + vue-resource,基于如下模板创建的开发环境: https://github.com/vuejs-templates/webpack  ...

  8. Webpack devServer中的 proxy 实现跨域

    Webpack dev server使用http-proxy解决跨域问题 文档资料 webpack关于webpack-dev-server开启proxy的官方介绍Vue-cli proxyTable ...

  9. webpack常用配置项配置文件介绍

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

随机推荐

  1. 内嵌iframe撑高父容器,底部有4px留白问题解决办法

    由于iframe是特殊标签, 1,iframe默认是块元素,其display样式默认值是block2,frame应该说即不是块元素也不是行内元素,它虽然有display样式,但其默认值是none3,f ...

  2. STM点滴一

    就就是你用BSRR和BRR去改变管脚状态的时候,没有被中断打断的风险.也就不需要关闭中断. This way, there is no risk that an IRQ occurs between ...

  3. go(一)基础知识

    一.第一个程序 基本程序结构 package main // 包 import "fmt" // 引入依赖代码 // 功能实现 func main() { fmt.Println( ...

  4. js插件-简单拖拽

    前端开发的时候,有好多地方用到拖拽效果,当然 http://jqueryui.com/draggable/  是个不错的选择,but 我是个打破砂锅问到底的人,抽点时间用js小小的实现了类似的插件,话 ...

  5. CSS分组和嵌套选择器

    CSS 分组 和 嵌套 选择器 分组选择器 在样式表中有很多具有相同样式的元素.直线模组哪家好 h1 {     color:green; } h2 {     color:green; } p { ...

  6. Adobe 2019 全家桶 Mac 版(最新版)

    经过不断的改革换新,Adobe2019系列已经全面来袭.在软件更新的同时,激活工具也不断的完善!小编带来的是Adobe2019注册机专门为同系列软件量身定做的注册破解工具!   ▌软件下载-关注公众号 ...

  7. POJ 1151 线段树+扫描线(计算矩形面积并)

    前一篇博客有了讲解就不再叙述了 #include<cstdio> #include<cstring> #include<cmath> #include<ios ...

  8. MySql插入数据成功但是报[Err] 1055

    1.问题: 这两天做insert操作,mysql版本是5.7,insert后虽然成功了,但是会报一个[Err] 1055的错误.具体如下: 2.解决方案: linux环境下,vim到my.cnf,添加 ...

  9. [CSP-S模拟测试]:影子(并查集+LCA)

    题目描述 一个人有很多的影子,新的旧的,他们不断消失重来.学者的影子在他苍白色的精神图景里成为了$n$个黑色的点,他们伸长的触手交叉形成了一颗黑色的树.假使每个影子点拥有一个权值$d_i$,黑色的树边 ...

  10. 用define 宏定义注释符号

    上面对define 的使用都很简单,再看看下面的例子:#define BSC //#define BMC /*#define EMC */D),BSC my single-line commentE) ...