没有合适的资源?快使用搜索试试~ 我知道了~
温馨提示
试读
2页
一款自动生成 vue 路由文件的 webpack 插件 vue-route-webpack-plugin 在项目中试点成功了,现在在项目中已经不需要再维护路由配置文件了,由插件自动生成,节省了大家维护路由的时间。 从长远来看,使用插件自动生成路由是具有一定好处的。当项目中的路由配置非常多的时候,为了区分业务,你可能需要分成许多个文件来存放这些路由文件,这样就不得不去维护这些路由文件。 比如这样的路由文件结构: |-src/ |-router/ index.js childrenRouter.js childrenRouters/ // ...some
资源推荐
资源详情
资源评论
使用使用 webpack 插件自动生成插件自动生成 vue 路由文件的方法路由文件的方法
一款自动生成 vue 路由文件的 webpack 插件 vue-route-webpack-plugin 在项目中试点成功了,现在在项目中已经不需要再维护路
由配置文件了,由插件自动生成,节省了大家维护路由的时间。
从长远来看,使用插件自动生成路由是具有一定好处的。当项目中的路由配置非常多的时候,为了区分业务,你可能需要分成
许多个文件来存放这些路由文件,这样就不得不去维护这些路由文件。
比如这样的路由文件结构:
|-src/
|-router/
index.js
childrenRouter.js
childrenRouters/
// ...some children router files
其中 childrenRouters 目录中维护了各个业务相关的路由。
每当要添加路由的时候,还得重复的写 import 和路由配置项。
比如:
import userlist from '@/views/user/list.vue';
import shoplist from '@/views/shop/list.vue';
import goodslist from '@/views/goods/list.vue';
//import ...
export default [
{
path: 'user/list',
name: 'userlist',
component: userlist,
alias: 'user',
},
{
path: 'shop/list',
name: 'shoplist',
component: shoplist,
alias: 'shoplist',
},
// ...
]
当一个项目的路由配置多了以后,要维护这些路由文件也是一件费时费神的事情。
现在使用 vue-route-webpack-plugin 插件来自动生成路由后,就无需再关心和维护这些路由文件了。
使用方式使用方式
注:以下摘自仓库 README,如有更新以仓库为准
安装安装
$ yarn add -D @xiyun/vue-route-webpack-plugin
配置配置
在 vue.config.js 或在 webpack 配置文件中加入插件配置:
const VueRouteWebpackPlugin = require('@xiyun/vue-route-webpack-plugin');
module.exports = {
configureWebpack: {
plugins: [
new VueRouteWebpackPlugin({
// 选项,见下文
})
],
}
资源评论
weixin_38499950
- 粉丝: 4
- 资源: 941
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功