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最新版本已經默認配置的，因此不須要配置熱加載等參數。