vue自動配置路由

vue專案開發過程中頁面太多，路由配置起來也是一件很麻煩的事，好在webpack提供了乙個require.context介面，通過執行require.context函式可以獲取乙個特定的上下文，實現自動化匯入模組。

一、語法

require.context('./dir', true, /\.js$/)；第乙個引數表示相對的檔案目錄，第二個引數表示是否包括子目錄中的檔案（true，false），第三個引數表示引入的檔案匹配的正規表示式。

二、自動配置路由

修改router資料夾下的index.js檔案即可

import vue from 'vue'

import router from 'vue-router'
import helloworld from '@/components/helloworld'
vue.use(router)
const contexts = require.context('../pages',true,/\.vue$/) //通過正則獲取匹配到的檔案:第乙個引數表示相對的檔案目錄，第二個引數表示是否包括子目錄中的檔案（true，false），如果有耳機目錄既可以設定為true，第三個引數表示引入的檔案匹配的正規表示式。
const routers = ;
contexts.keys().foreach(key=>)
})export default new router()

vue路由配置，vue子路由配置

現在乙個專案已經部署完成，接下來我們從路由開始！還記得在初始化專案的時候，有提示是否需要安裝vue router，對沒錯，vue中路由全靠它！首先找到路由配置檔案 router index.js，是整個專案路由配置檔案 首先看最上面的，這個模組引入，es2015中的import.from.將你需要配...

vue路由配置

1.main.js the vue build version to load with the import command runtime only or standalone has been set in webpack.base.conf with an alias.import vue ...

vue路由配置

1 安裝路由，因為路由是vue的乙個外掛程式。npm cnpm install vue router d2 在main.js中引入路由 import vue form vue import vuerouter from vue router vue.use vuerouter 3 在main.js中...