Skip to content

Commit 9c0bf4c

Browse files
aweikaleehaoqunjiang
authored andcommitted
feat!: manifest.json should be generated by cli-plugin-pwa (#2981)
BREAKING CHANGE: For those who changed their `manifest.json` in `public/` directory, their changes will be ignored.
1 parent 8f0673a commit 9c0bf4c

File tree

3 files changed

+57
-21
lines changed

3 files changed

+57
-21
lines changed

packages/@vue/cli-plugin-pwa/README.md

+13
Original file line numberDiff line numberDiff line change
@@ -71,6 +71,19 @@ file, or the `"vue"` field in `package.json`.
7171

7272
The path of app’s manifest.
7373

74+
- **pwa.manifestOptions**
75+
76+
- Default: `{}`
77+
78+
The object will be used to generate the `manifest.json`
79+
80+
If the following attributes are not defined in the object, the options of `pwa` or default options will be used instead.
81+
- name: `pwa.name`
82+
- short_name: `pwa.name`
83+
- start_url: `'.'`
84+
- display: `'standalone'`
85+
- theme_color: `pwa.themeColor`
86+
7487
- **pwa.iconPaths**
7588

7689
- Defaults:

packages/@vue/cli-plugin-pwa/generator/template/public/manifest.json

-20
This file was deleted.

packages/@vue/cli-plugin-pwa/lib/HtmlPwaPlugin.js

+44-1
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,26 @@ const defaults = {
77
appleMobileWebAppCapable: 'no',
88
appleMobileWebAppStatusBarStyle: 'default',
99
assetsVersion: '',
10-
manifestPath: 'manifest.json'
10+
manifestPath: 'manifest.json',
11+
manifestOptions: {}
12+
}
13+
14+
const defaultManifest = {
15+
icons: [
16+
{
17+
"src": "./img/icons/android-chrome-192x192.png",
18+
"sizes": "192x192",
19+
"type": "image/png"
20+
},
21+
{
22+
"src": "./img/icons/android-chrome-512x512.png",
23+
"sizes": "512x512",
24+
"type": "image/png"
25+
}
26+
],
27+
start_url: '.',
28+
display: 'standalone',
29+
background_color: "#000000"
1130
}
1231

1332
const defaultIconPaths = {
@@ -109,6 +128,30 @@ module.exports = class HtmlPwaPlugin {
109128

110129
cb(null, data)
111130
})
131+
132+
133+
})
134+
135+
compiler.hooks.emit.tapAsync(ID, (data, cb) => {
136+
const {
137+
name,
138+
themeColor,
139+
manifestPath,
140+
manifestOptions
141+
} = this.options
142+
const publicOptions = {
143+
name,
144+
short_name: name,
145+
theme_color: themeColor
146+
}
147+
const outputManifest = JSON.stringify(
148+
Object.assign(publicOptions, defaultManifest, manifestOptions)
149+
)
150+
data.assets[manifestPath] = {
151+
source: () => outputManifest,
152+
size: () => outputManifest.length
153+
}
154+
cb(null, data)
112155
})
113156
}
114157
}

0 commit comments

Comments
 (0)