webpack4體驗


webpack-dev-server的3.1.0版本只支持webpack4,所以以前的版本都不能使用3.1.0版本。

而webpack4把webpack-cli分離開來,所以要單獨安裝。

而webpack4較之前的版本運行更快。

在官網給出的示例中,可以不用配置entry和output,默認的entry:’/src’, 
默認的output:’./dist’,但是零配置的情況下’./src’的入口文件的文件名必須是index.js,否則會報錯。

 

約定了生產模式和開發模式下的配置

在之前的版本中,針對生產環境和開發環境,需要做不同的配置, 
常見的都是指定標量,然后在webpack.config.js配置文件中,進行環境判別,

"scripts":{

   "prod":"NODE_ENV=production webpack -p"

}

判別出環境后,再在配置文件中,根據不同的環境做不同的打包工作。 
或者是生成兩個配置文件,webpack.dev.js和webpack.prod.js,分別對應於兩個環境。

在Webpack4.0中,通過mode指定環境。

在Webpack中,提供了mode變量,用於配置運行環境,mode的值可以為development,表示的是開發模式,或者是production,表示的是生產模式。

"scripts":{
  "build":"webpack --mode production"
}

在Webpack中約定了針對開發環境和生成環境的一些默認操作。所以一般沒必要不需要在分兩份配置文件。

 

使用package.json的scripts啟動時直接到node_modules目錄下尋找啟動的,所以局部安裝可以直接配置到scripts里。

"scripts": {
    "start": "webpack --mode development",
    "dev": "webpack-dev-server --mode development"
  }

 

目前webpack4還是不穩定版本,所以還是有問題的,現在我的webpack-dev-server熱加載無效,不知道為什么。還有webpack-dev-server最新版本已經默認配置的,所以不需要配置熱加載等參數。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM