教育專案 VUE高階 二 18

2021-10-17 04:57:08 字數 616 閱讀 3714

以下配置的意思是:讀取當前專案目錄下src資料夾中的main.js(入口檔案)內容,分析資源依賴,把相關的js檔案打包,打包後的檔案放入當前目錄的dist資料夾下,打包後的js檔名為bundle.js

const path =

require

("path");

內建模組

module.exports =

}

webpack#有黃色警告

webpack --mode=development#沒有警告【使用這個】

#執行後檢視bundle.js 裡面包含了上面兩個js檔案的內容並驚醒了**壓縮

也可以配置專案的npm執行命令,修改package.json檔案

"scripts"

:

引用bundle.js

"dist/bundle.js"

>

<

/script>

<

/body>

教育專案 VUE高階 二 17

三 初始化專案 webpack 是乙個前端資源載入 打包工具。它將根據模組的依賴關係進行靜態分析,然後將這些模組按照指定的規則生成對應的靜態資源。從圖中我們可以看出,webpack 可以將多種靜態資源 js css less 轉換成乙個靜態檔案,減少了頁面的請求。npm install g webp...

vue高階總結二

上篇僅僅談論到介面資料渲染,這篇主要是使用過程中的demo 解決方法 1 路由配置檔案router index.js 跳轉路由前判斷是否登入2 關於涉及許可權頁面元件載入函式判斷 router.beforeeach to,from next else else export default rout...

Vue高階攻略之搭建Vue專案

開啟控制命令列程式 cmd 檢查是否正常 npm install g cnpm registry 這樣就可以使用cnpm 命令來安裝模組了 1.第一步 安裝vue cli 專案腳手架 cnpm install vue cli g 全域性安裝 vue cli 選定路徑,新建vue專案,這裡我是在桌面上...