vue 打包命令 Vue面試題總結

2021-10-18 00:17:08 字數 4554 閱讀 7291

vue面試題文件內容主要包括vue-cli工程,vue核心知識點,vue-router,vuex,http請求,ui樣式,常用功能,mvvm設計模式,深入拓展。
(1)vue.js:vue-cli工程的核心,主要特點是 雙向資料繫結 和 元件系統。

(3)vuex:專為 vue.js 應用專案開發的狀態管理器,主要用於維護vue元件間共用的一些 變數 和 方法。

(4)axios( 或者 fetch 、ajax ):用於發起 get 、或 post 等 http請求,基於 promise 設計。

(5) vux等:乙個專為vue設計的移動端ui元件庫。

(6)建立乙個emit.js檔案,用於vue事件機制的管理。

(7) webpack:模組載入和vue-cli工程打包器。

npm install
啟動 vue-cli 開發環境的 npm命令:

npm run dev
vue-cli 生成 生產環境部署資源 的 npm命令:

npm run build
用於檢視 vue-cli 生產環境部署資源檔案大小的 npm命令:

npm run build --report
vue-cli目錄解析:

(1) build 資料夾:用於存放 webpack 相關配置和指令碼。開發中僅 偶爾使用 到此資料夾下 webpack.base.conf.js 用於配置 less、sass等css預編譯庫,或者配置一下 ui 庫。

(2) config 資料夾:主要存放配置檔案,用於區分開發環境、線上環境的不同。 常用到此資料夾下 config.js 配置開發環境的 埠號、是否開啟熱載入 或者 設定生產環境的靜態資源相對路徑、是否開啟gzip壓縮、npm run build 命令打包生成靜態資源的名稱和路徑等。

(3) dist 資料夾:預設 npm run build 命令打包生成的靜態資源檔案,用於生產部署。

(5) src: 存放專案原始碼及需要引用的資源檔案。

(6) src下assets:存放專案中需要用到的資源檔案,css、js、images等。

(7) src下componets:存放vue開發中一些公共元件:header.vue、footer.vue等。

(8) src下emit:自己配置的vue集中式事件管理機制。

(9) src下router:vue-router vue路由的配置檔案。

(10) src下service:自己配置的vue請求後台介面方法。

(11) src下page:存在vue頁面元件的資料夾。

(12) src下util:存放vue開發過程中一些公共的.js方法。

(13) src下vuex:存放 vuex 為vue專門開發的狀態管理器。

(15) src下main.js:vue-cli工程的入口檔案。

用於掛載 vue 節點。

(17) package.json:用於 node_modules資源部 和 啟動、打包專案的 npm 命令管理。

(1) index:配置打包**口.html檔案的名稱以及資料夾名稱

(2) assetsroot:配置打包後生成的檔名稱和路徑

(3) assetspublicpath:配置 打包後 .html 引用靜態資源的路徑,一般要設定成 "./"

(4) productiongzip:是否開發 gzip 壓縮,以提公升載入速度

dev 物件下對於開發環境的配置:

(1) port:設定埠號

(2) autoopenbrowser:啟動工程時,自動開啟瀏覽器

(3) proxytable:vue設定的**,用以解決跨域問題

常用物件解析:

(1) scripts:npm run *** 命令呼叫node執行的 .js 檔案

(2) dependencies:生產環境依賴包的名稱和版本號,即這些 依賴包 都會打包進 生產環境的js檔案裡面

(3) devdependencies:開發環境依賴包的名稱和版本號,即這些 依賴包 只用於 **開發 的時候,不會打包進 生產環境js檔案 裡面。

118頁vue面試題總結,為面試提前做準備​www.jianshu.com

1、對於vue是一套漸進式框架的理解

2、vue.js的兩個核心是什麼?

3、請問v-ifv-show有什麼區別

4、vue常用的修飾符

5、v-on可以監聽多個方法嗎?

6、vue中key值的作用

7、vue-cli工程公升級vue版本

8、vue事件中如何使用event物件?

9、$nexttick的使用

10、vue 元件中 data 為什麼必須是函式

11、v-for 與 v-if 的優先順序

12、vue中子元件呼叫父元件的方法

13、vue中keep-alive元件的作用

14、vue中如何編寫可復用的元件?

15、什麼是vue生命週期?

16、vue生命週期鉤子函式有哪些?

17、vue如何監聽鍵盤事件中的按鍵?

18、vue更新陣列時觸發檢視更新的方法

19、vue中物件更改檢測的注意事項

20、解決非工程化專案初始化頁面閃動問題

21、v-for產生的列表,實現active的切換

22、v-model語法糖的元件中的使用

23、vue中自定義過濾器

24、vue等單頁面應用及其優缺點

25、什麼是vue的計算屬性?

26、vue-cli提供的幾種腳手架模板

27、vue父元件如何向子元件中傳遞資料?

28、vue彈窗後如何禁止滾動條滾動?

29、計算屬性的快取和方法呼叫的區別

30、vue-cli中自定義指令的使用

1、vue-router如何響應 路由引數 的變化?

2、完整的 vue-router 導航解析流程

3、vue-router有哪幾種導航鉤子( 導航守衛 )?

4、vue-router傳遞引數的幾種方式

5、vue-router的動態路由匹配

6、vue-router如何定義巢狀路由?

7、元件及其屬性

8、vue-router實現路由懶載入( 動態載入路由 )

9、vue-router路由的兩種模式

10、history路由模式配置及後台配置

1、什麼是vuex?

2、使用vuex的核心概念

3、vuex在vue-cli中的應用

4、在vue中使用vuex,修改state的值

5、vuex actions非同步修改狀態

1、promise物件是什麼?

2、axios、fetch與ajax有什麼區別?

3、什麼是js的同源策略和跨域問題?

4、如何解決跨域問題?

5、axios有什麼特點?

1、.vue元件的scoped屬性的作用

2、如何讓css只在當前元件中起作用?

3、vue-cli中常用的ui元件庫

4、如何適配移動端?【 經典 】

5、移動端**查詢

6、vue內容垂直和水平居中

7、vue-cli引入的方法

8、移動端常見樣式問題

9、文字超出隱藏

1、vue中如何實現tab切換功能?

2、vue中keep-alive 實現標籤頁元件快取

3、vue中實現頁面從右往左側滑入效果

4、vue中父子元件如何相互呼叫方法?

5、vue**事件匯流排的使用

1、mvc、mvp與mvvm模式

2、mvc、mvp與mvvm的區別

3、mvvm的實現原理

4、object.defineproperty()方法

5、 es6中定義的類和物件

6、js中的文件碎片

7、解構賦值

8、array.from

9,array.reduce

10、遞迴的使用

11、obj.keys()與obj.defineproperty

12、發布-訂閱模式

13、vue專案優化,縮短首屏載入時間

1、vue開發命令 npm run dev 輸入後的執行過程

2、vue的伺服器端渲染

3、從零寫乙個npm安裝包

4、vue-cli中常用到的載入器

5、webpack的特點

原作者姓名: 前小小

Vue面試題總結

v show和v if之間的區別 為何v for中要用key 描述vue元件生命週期 有父子元件的情況 父子元件生命週期關係 子元件更新過程 父元件更新過程 銷毀過程 vue元件如何通訊 描述元件渲染和更新的過程 雙向資料繫結v model的實現原理 對mvvm的理解 computed有何特點 為何...

Vue面試題總結(1)

vue作為前端目前最受歡迎的框架,成為了眾多公司和程式設計師的技術首選。我最近可能也要準備面試了,所以找了一些資料整合一下 重點 一定要理解vue的mvvm原理,面試必問!採用資料劫持結合發布者 訂閱者模式的方式,通過object.defineproperty 來劫持各個屬性的setter,gett...

vue面試題 vue原理

1.元件化和mvvm 2.響應式原理 3.vdom 和 diff 演算法 4.模板編譯 5.元件渲染過程 6.前端路由 元件化基礎 1.很久以前 的元件化 asp jsp php 已經有元件化 nodejs 中已有類似元件化 2.資料驅動檢視 vue mvvm 3.資料驅動檢視 react sets...