如何更改VuePress生成的块名称

问题描述 投票:0回答:1

我想将Vuepress用于文档。我们的文档将是100%静态的,并且每个内容都是私有的。

出于业务原因,我们应按路由配置RBAC。例如,/foo仅可通过admin访问,而/bar可通过adminemployee访问。

但是,似乎webpack输出不适合基于路由的授权。

enter image description here

每个编译的js文件都在单个目录assets/js中。例如,我无法应用基于路由的反向代理策略,因为我不知道哪些文件属于哪些路由,例如2.99194163.js是用于/foo还是/bar。要知道这一点,就必须读取每个编译的js文件,这是不适用的。

默认情况下,这是Vuepress的webpack配置。

output: {
  filename: 'assets/js/[name].[chunkhash:8].js',
}

是否可以像这样按路线组织?

assets/js
├── index
│   ├── app.0cb5ae60.js 
│   └── 10.059a7fe4.js
├── foo
│   ├── 11.62278c9d.js
│   ├── 12.9652ff3d.js
│   └── 13.c6c6b9fd.js
└── bar
    ├── 14.c8879eeb.js
    ├── 2.99194163.js
    ├── 3.7d54bf6f.js
    ├── 4.0c81bce7.js
    ├── 5.e47d5dbb.js
    ├── 6.004df3e0.js
    ├── 7.966197b8.js
    ├── 8.4bd54fba.js
    └── 9.78a40dc1.js

提前感谢!

vue.js webpack authorization single-page-application vue-cli
1个回答
0
投票

您可以使用vuepress-plugin-named-chunks插件来修改VuePress为每个页面生成的js块的名称和路径...

  1. 安装插件
  2. 更改vuepress-plugin-named-chunks
.vuepress\config.js

内部使用module.exports = { plugins: [ [ "named-chunks", { pageChunkName: function(page) { let chunkPath = page.path.substring(1) + page.key; // console.log(chunkPath); return chunkPath; } } ] ] }; webpackChunkName

如果您的pageChunkName返回的字符串不仅包含文件名,还包含路径,重要的是不要包含反斜杠-"magic comment"将起作用,guide/readme.js将不起作用.....

© www.soinside.com 2019 - 2024. All rights reserved.