什麼是Webpack 怎麼使用Webpack

2021-09-24 22:23:02 字數 928 閱讀 7185

什麼是webpack?怎麼使用webpack?

什麼是webpack?

webpack模組打包工具,它會分析模組之間的依賴關係,然後使用loaders處理它們,最後生成乙個優化並合併後的靜態資源。

簡單的說就是打包,壓縮各種靜態資源的工具

2.目的?

效能優化

減少瀏覽器像伺服器的請求次數

節約伺服器的頻寬資源

3.如何使用webpack?

(1)webpack的環境搭建

webpack是基於nodejs,執行在nodejs環境下

使用webpack之前要先搭建node環境

(2)全域性安裝webpack

npm i -g webpack

(3)在終端使用npm init 自動建立package.json檔案

npm init -y   //加上-y就不用再一路回車這麼麻煩了

(4)安裝webpack

npm install webpack -d  //-d是裝到開發依賴中

(5)安裝webpack的依賴包

npm install

(6)解除安裝webpack

第一先建立webpack的配置檔案 webpack.config.js

module.exports=

}注:main.js檔案是我們要打包的檔案

build.js檔案是我們打包後的輸出檔案

檔案:import jquery from "jquery";

import "./common/css/style.css";

import "./common/css/style.less"

jquery(function())

})第二在package.json配置bulid

第三引檔案(注意要引打包後的build.js檔案)

我是keri

webpack詳解,什麼是webpack

1.理解什麼是webpack 上網搜尋的直接解釋是 模組化打包機 或者 模組打包工具。首先,認為它是乙個工具,幫助我們更好的處理事情的。其次,打包 如何理解?假設我們需要寄快遞。我們將許多的物品都放進了乙個紙皮箱,然後進行封箱。這就是打包。對應到前端開發來說,就是將很多的的 css檔案,js檔案,等...

什麼是W3C標準

什麼是w3c標準?引子 目前w3c標準已經成為高階客戶設計 的首選,我們知道國內上網者中,用ie瀏覽器的比較多,但從國內或全世界的上網客戶來看,有些客戶並不是用ie來上網瀏覽內容的,他們會用 一些其它的瀏覽工具如 netscape,mozilla,firefox,opera等等,如果您的 不是採用的...

什麼是vue外掛程式,vue外掛程式怎麼使用?

官方解釋 外掛程式通常用來為 vue 新增全域性功能。外掛程式的功能範圍沒有嚴格的限制 一般有下面幾種 新增全域性方法或者屬性。如 vue custom element 新增全域性資源 指令 過濾器 過渡等。如 vue touch 通過全域性混入來新增一些元件選項。如 vue router 新增 v...