教育專案 VUE高階 二 17

2021-10-17 04:57:08 字數 774 閱讀 6527

三、初始化專案

webpack 是乙個前端資源載入/打包工具。它將根據模組的依賴關係進行靜態分析,然後將這些模組按照指定的規則生成對應的靜態資源。

從圖中我們可以看出,webpack 可以將多種靜態資源 js、css、less 轉換成乙個靜態檔案,減少了頁面的請求。

npm install -g webpack webpack-cli
webpack -v
進入webpack目錄,執行命令

npm init -y
exports.info = function (str)

exports.add = function (a, b)

const common =

require

('./common');

const utils =

require

('./utils');

common.

info

('hello world!'

+ utils.

add(

100,

200)

);

教育專案 VUE高階 二 18

以下配置的意思是 讀取當前專案目錄下src資料夾中的main.js 入口檔案 內容,分析資源依賴,把相關的js檔案打包,打包後的檔案放入當前目錄的dist資料夾下,打包後的js檔名為bundle.js const path require path 內建模組 module.exports webpa...

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專案,這裡我是在桌面上...