webpack 打包html檔案

2021-10-16 22:08:47 字數 578 閱讀 2214

webpack.config.js配置檔案內容為:

/**

*/// 用來拼接絕對路徑的方法

const

=require

('path'

)const htmlwebpackplugin =

require

('html-webpack-plugin'

)module.exports =

,// loader 配置

module :

,// plugins 的配置

plugins :

[// 詳細 plugins 的配置

// html-webpack-plugin

// 功能:缺省會建立乙個空的html檔案,自動引入打包輸出的所有資源(js/css)

newhtmlwebpackplugin()

],//模式

mode :

'development'

,// 生產模式

// mode : 'production' // 開發模式

}

webpack打包檔案

webpack.config.js是自己建立的打包檔案 在檔案的跟目錄下 引用html webpack plugin 首先要 npm install html webpack plugin s 在命令列中執行一下 let path require path 引入這個檔案就不會把相對路徑變成絕對路徑 ...

webpack打包 vue檔案

在webpack中配置.vue元件頁面的解析 vue loader 1 執行npm i vue s將vue安裝為執行依賴 2 運cnpm i vue loader vue template compiler d將解析轉換vue的包安裝為開發依賴 3 執行npm i style loader css ...

webpack打包快取 webpack打包效能分析

webpack提供的uglifyjs外掛程式由於採用單執行緒壓縮,速度很慢 webpack parallel uglify plugin外掛程式可以並行執行uglifyjs外掛程式,這可以有效減少構建時間,當然,該外掛程式應用於生產環境而非開發環境,配置如下 var paralleluglifypl...