webpack學習筆記

2022-09-14 12:42:08 字數 548 閱讀 7899

babel-loader:它是使babel與webpack協同工作的模組

@babel/core:顧名思義,它是babel編譯器的核心模組

@babel/preset-env:它是babel官方推薦的預置器,可根據使用者設定的目標環境自動新增所需的外掛程式和補丁來編譯es6+**

babel-loader支援從 .babelrc檔案讀取babel配置。

output.path是資源的打包輸出路徑,output.publicpath是資源引用路徑

許多框架和庫都採用process.env.node_env作為乙個區別開發環境和生產環境的變數,process.env是node.js用於存放當前程序環境變數的物件,而node_env則可以讓開發者指定當前的執行環境。

source map就是將編譯。打包。壓縮後的**對映回源**的過程,因為經過webpack打包壓縮後的**已經不具備可讀性,瀏覽器除錯起來非常麻煩,使用source map之後map檔案會很大,但是不用擔心,只要不開啟開發者工具,瀏覽器是不會載入這些檔案的,但是有一定的安全隱患,因為所有人都可以通過dev tools看到工程原始碼。

Webpack學習筆記

自我總結 如其名,一些入口處的引導檔案 定義 output 位於物件最頂級鍵 key 包括了一組選項,指示 webpack 如何去輸出 以及在 輸出你的 bundle asset 和其他你所打包或使用 webpack 載入的任何內容 自我總結 這個也沒什麼說的,如其名,定義了最終生成檔案的位址以及其...

webpack 學習筆記

學習資源來自前端工程化 webpack.html 課程專題 使用webpack搭建生產環境工作流.html 這兩個教程必須同時看著,互相補充。impot和 export是es6新語法,需要用babel轉一下,直接執行不了 配置webpack.config.js時候,需要引入path模組。1 例 co...

webpack學習筆記(四)

當前優化 配置本地開發環境 引入webpack dev server 區分開發環境和生產環境 tips node sass可能出現安裝不成功的情況,請使用cnpm並且刪除依賴重試 npm install npm run build 路徑.webpack.dev.config.js const pat...