Vue專案建立和配置檔案關係呼叫

2021-10-04 10:19:34 字數 1380 閱讀 5184

1

| vue init webpack demo // demo是自定義專案跟目錄名,無此目錄則自動建立

cd demo

npm start // 推薦使用npm run dev,該命令完整webpack環境可使用(webpack-******環境無法使用),具體可在配置檔案package.json中檢視:

此時,可知main.js檔案呼叫關係分為三步,如圖中序號:

3. router資料夾下此時只有index.js檔案,其中routes:規定了檔案位址及其url位址對映

4. 根據檔案位址,載入元件(helloworld.vue),元件被渲染在中,顯示在index.html

然而追本溯源,呼叫關係中仍有兩個問題:

index.html為何預設顯示?

其實,雙擊執行npm中dev時,控制台將執行如下語句:

webpack-dev-server --inline --progress --config build/webpack.dev.conf.js
由此可見,執行時啟動檔案webpack.dev.conf.js,而檔案中包含如下語句,規定了起始頁面:

new

htmlwebpackplugin()

,

main.js為何預設載入?

因為使用的腳手架工具vue-cli裡用webpack來打包專案檔案,webpack.dev.conf檔案裡還定義了webpack基礎配置檔案webpack.base.conf.js,定義語句如下:

const basewebpackconfig =

require

('./webpack.base.conf'

)

而檔案webpack.base.conf.js中,包含如下語句,指定了入口:

entry:

以上就是乙個完整的vue專案建立及配置檔案修改和呼叫關係的說明

webstorm建立和除錯vue專案

建立專案資料夾webpack vue,並cd進入 安裝vue cli npm install g vue cli初始化 vue init webpack預設項enter鍵,其他按情況選擇y n 個性化設定,頁面與快捷鍵可以匯入 這裡的jar包 license server啟用位址 匯入 執行 也可以...

vue配置檔案分析

在vue cli3.0版本以上中,vue搭建的專案就去掉了config檔案,這就是意味著當我們在需要一些的配置的時候,需要自己建立檔案,當然檔案的命名和格式並不是隨便寫的,需要遵循vue檔案的格式才可以。vue.config.js 這個檔案就是我們經常需要用到的檔案,在這裡相當於vue cli2裡面...

建立使用者配置檔案

建立使用者配置檔案 語法 create profile profile name limit 資源限制引數名 口令限制引數名 引數值 舉例 配置檔案 允許3次輸入口令錯誤 每隔15天修改一次登入口令 使用者最多能夠建立10個資料庫會話 15分鐘的空閒狀態,超過時,會話自動斷開 每隔會話持續連線資料庫...