码迷,mamicode.com
首页 > Web开发 > 详细

webpack devServer配置项的坑

时间:2019-11-25 16:51:38      阅读:76      评论:0      收藏:0      [点我收藏+]

标签:字段   打包   www   https   icp   ack   npm   port   http   

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

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

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

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

上代码

module.exports = {
    entry: {
        // ...
    },
    output: {
        // ...
        publicPath: "./",//为什么把这个字段列出来呢,下面会有解释
    },
    devServer: {
        contentBase: ‘/index.html‘,//设置服务构建的资源来自于那个文件夹则默认为 这个项目使用源文件(没有打包过的文件,非dist)来开启服务,如果指定打包后的文件开启服务,则需要用publicPath

        publicPath: "",//设置服务构建的资原来自那个目录,必须设置,不然无法访问 其原因是在开始服务的时候 我的命令是 npm run start 会进行一次打包,
        //打包后资源输出的地方是在内存里面,你通过http://127.0.0.1:8081/dist(启动服务后会出现地址) 是访问不到的,只有在这里指定 其实你更可以把这里理解为,在服务启动时打包的文件输出的地点,并将开启服务所需要的资源
         地址指定 例如 你指定的是/dist 那么你访问地址就是http://127.0.0.1:8081/dist  指定为/ 访问地址就是 http://127.0.0.1:8081/

        //...
        //本项中上面两项配置是有坑的,特别是对新手来说,而且他的配置,大体上通过翻阅webpack配置文旦就可里顺利的调用,所以就不再叙述
        //devserver中还有很多配置选项,想要详细了解可以访问https://www.webpackjs.com/configuration/dev-server/#devserver-host
    }
}

 

webpack devServer配置项的坑

标签:字段   打包   www   https   icp   ack   npm   port   http   

原文地址:https://www.cnblogs.com/wrhbk/p/11928722.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!