Vue Cli 3项目无法生成manifest.json（PWA）

Question

我有一个Vue Cli 3项目，安装并配置了@vue/cli-plugin-pwa插件（在vue.config.js中），但当我运行vue-cli-service build --modern时，没有基于我的配置生成manifest.json。

我期望看到一个manifest.json，至少包含我指定的图标路径。也许还包括我在vue.config.js中设置的信息。

我是否做错了什么，或者我的插件应该如何工作的预期与实际行为不符？

我应该如何让Vue生成我的manifest.json？

- alexandernst

---

@AdamOrlov 我几乎确定我做了，但有没有办法可以检查一下？ - alexandernst

我认为你的package.json文件中应该有相关信息。除了manifest.json文件之外，还应该创建registerServiceWorker.js文件。你有这个文件吗？ - Adam Orłowski

是的，我有registerServiceWorker.js。我还检查了Vue UI，并且它显示PWA组件已启用，这意味着该项目支持PWA。那么，为什么Vue没有生成manifest.json文件呢？ - alexandernst

我创建了一个新项目，选中手动配置，然后启用了PWA。我看到在新生成的项目的public文件夹中有一个名为manifest.json的文件。但是，我编辑了vue.config.js文件中的pwa部分，并更改了应用程序的名称，然后运行了yarn vue build。结果（在dist文件夹中）包含一个manifest.json文件，但它具有“旧”的项目名称而不是我在vue.config.js中输入的名称。这意味着构建过程只是盲目地复制public文件夹中的所有内容（包括manifest.json文件），而不是生成它。 - alexandernst

发现这个问题：https://github.com/vuejs/vue-cli/issues/3383 - 看起来 manifest.json 的状态不太清楚！我认为它应该被生成，但实际上并没有... - benzkji

Answer 1

我遇到了同样的问题。我执行了生产环境打包命令：yarn build或者npm build，并在dist文件夹中找到了manifest.json文件。

- Jessica Burnett

---

同样的问题。如果我们需要改变manifest.json，那么我们直接在dist文件夹中做改动吗？ - Coisox

@Coisox 我的应用程序能够正常工作，因为manifest.json位于dist文件夹中，所以我想这是正确的位置。 - Mikel Granero

Answer 2

尝试在公共文件夹下手动添加manifest.json，或者您也可以将npm构建后生成的manifest.json复制到dist文件夹下，然后根据您的需求进行编辑。还要检查您的浏览器是否检测到manifest.json。

- Akhil Thakur

---

如果您查看官方文档，无法在开发模式下访问manifest.json。如果您希望更改配置，则可以通过vue.config.js文件中的PWA属性进行处理。您可以参考https://cli.vuejs.org/core-plugins/pwa.html#configuration文档。 - Akhil Thakur