webpack構(gòu)建Vue+ElementUI單頁面應(yīng)用(3)——webpack-dev-server基礎(chǔ)配置

第一篇文章package.json中我們配置的scripts有webpack-dev-server,下面開始配置webpack-dev-server,

  • 安裝webpack-dev-server

npm i webpack-dev-server -D
  • 配置webpack.dev.conf.js

module.exports = {
   devServer: {
      contentBase: path.resolve(__dirname, "../dist"), //網(wǎng)站的根目錄為 根目錄/dist,這個路徑一般與output.path一致,因為html插件生成的html5頁是放在output.path這個目錄下
      port: 9000, //端口改為9000
      open:true, // 自動打開瀏覽器,每次啟動服務(wù)器會自動打開默認(rèn)的瀏覽器
      index:'index.html', // 與HtmlWebpackPlugin中配置filename一樣
      inline:true, // 默認(rèn)為true, 意思是,在打包時會注入一段代碼到最后的js文件中,用來監(jiān)視頁面的改動而自動刷新頁面,當(dāng)為false時,網(wǎng)頁自動刷新的模式是iframe,也就是將模板頁放在一個frame中
      hot:false,
      compress:true //壓縮
    }
}
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容