yc-vue-route-plugin

介绍

扫描项目中vue文件的路由配置并生成路由文件的一款 webpack 插件。

使用方式

快速尝试

在仓库中有一个 example 目录，你可以将本项目克隆到本地后，进入到该目录下，执行：

$ yarn install
// 然后执行
$ yarn start 
// 或 
$ yarn build

执行完上述命令后，你就可以在src/router/目录下看到自动生成的路由文件了。 你可以自行修改pages目录中的文件查看编译后的路由改动结果。

安装

$ yarn add -D yc-vue-route-plugin

配置

在vue.config.js或在webpack配置文件中加入插件配置：

const VueRouteWebpackPlugin = require("yc-vue-route-plugin");

module.exports = {
  configureWebpack: {
    plugins: [
      new VueRouteWebpackPlugin({
        // 选项，见下文
        filePath: path.join(__dirname, './src/pages'),
      	routePath: path.join(__dirname, './src/router/index.js')
      })
    ],
  }
};

选项参考

插件提供了以下这些选项供自定义配置

new VueRouteWebpackPlugin({
  // 插件扫描的项目目录，绝对路径
  filePath: path.join(__dirname, './src/pages'),
  // 生成的路由文件存放地址，绝对路径
  routePath: path.join(__dirname, './src/router/index.js'),
  // 是否使用vue3模版，默认false
  isVue3: true,
  // 是否使用history路由，默认false
  isHistory: true,
})