vitepress icon indicating copy to clipboard operation
vitepress copied to clipboard

No install button

Open bilogic opened this issue 6 months ago • 8 comments

  1. I ran this https://github.com/vite-pwa/vitepress/tree/main/examples/pwa-simple-assets-generator and it did not have an install button appear in the address bar of Edge/Chrome
  2. Is this by design?

Update 1

https://github.com/vite-pwa/vitepress/tree/main/examples/pwa-prompt This other example did show the install button, looking into why that is

bilogic avatar May 09 '25 03:05 bilogic

You need a custom VP theme, check the docs package, using vp pwa integration and vp.

Check the theme folder https://github.com/vite-pwa/docs/tree/main/.vitepress/theme

userquin avatar May 09 '25 08:05 userquin

I Will check it later, all the examples were working even in dev mode.

userquin avatar May 09 '25 08:05 userquin

https://github.com/vite-pwa/vitepress/tree/main/examples/pwa-prompt

this has the component - https://github.com/vite-pwa/vitepress/blob/main/examples/pwa-prompt/.vitepress/theme/components/ReloadPrompt.vue

https://github.com/vite-pwa/vitepress/tree/main/examples/pwa-simple-assets-generator

this doesn't

Refer: https://vite-pwa-org.netlify.app/frameworks/vitepress.html#import-virtual-modules for theme setup.

brc-dd avatar May 09 '25 08:05 brc-dd

The component is not related to this issue, the issue is about the browser install button in the address bar to install the app as a pwa.

The pwa simple example using register type autoUpdate and pwa-prompt using prompt. The issue must be something about sw precaching (some 404 when sw downloading assets in the precaching manifest).

userquin avatar May 09 '25 08:05 userquin

@bilogic How do you run the example? After installing dependencies and building the repo, chrome showing the install button (Windows 11):

Image

userquin avatar May 09 '25 13:05 userquin

Which example were you using in your screenshot?

When I ran https://github.com/vite-pwa/vitepress/tree/main/examples/pwa-simple-assets-generator in both dev and build.

After reporting this, I used https://github.com/vite-pwa/vitepress/tree/main/examples/pwa-prompt as a base for my needs. So technically, I'm no longer stuck.

I will try in a bit to see if I can reproduce the issue with https://github.com/vite-pwa/vitepress/tree/main/examples/pwa-simple-assets-generator

bilogic avatar May 09 '25 15:05 bilogic

My screenshot is running https://github.com/vite-pwa/vitepress/tree/main/examples/pwa-simple-assets-generator in dev mode

userquin avatar May 09 '25 15:05 userquin

  • npm run dev https://github.com/vite-pwa/vitepress/tree/main/examples/pwa-simple-assets-generator Image

Same, no install icon, I did make some changes to my package.json by hardcoding the vitepress version in order for npm run dev to work

{
  "name": "pwa-simple-assets-generator",
  "type": "module",
  "version": "0.0.0",
  "private": "true",
  "scripts": {
    "dev": "vitepress dev",
    "build": "vitepress build",
    "preview": "nr build && vitepress serve",
    "https": "nr build && serve .vitepress/dist"
  },
  "devDependencies": {
    "https-localhost": "^4.7.1",
    "typescript": "^5.4.5"
  },
  "dependencies": {
    "@vite-pwa/vitepress": "^1.0.0",
    "vitepress": "^1.6.3"
  }
}

bilogic avatar May 10 '25 05:05 bilogic