vue-cli-plugin-browser-extension icon indicating copy to clipboard operation
vue-cli-plugin-browser-extension copied to clipboard

Build Manifesto.json file missing fields

Open adrielwerlich opened this issue 4 years ago • 6 comments

Describe the bug

While trying to load the 'build' directory file into the chrome extension plugin management was showing the following errors:

1- Location used, but default_locale was not specified in the manifest 2- version key,value pair missing

In order to solve this I had to manually copy the original manifesto.json file of the 'src' folder into the 'build' folder

Expected behavior A clear and concise description of what you expected to happen.

Screenshots

Automated build manifesto.json missing keys image

Should have "version": "2.0" and "default_locale": "en" key,value pairs

image

Is there a way to simply copy the original manifest file into the 'build' directory withouth modifications?

adrielwerlich avatar Mar 03 '20 14:03 adrielwerlich

Is there a way to simply copy the original manifest file into the 'build' directory withouth modifications?

As it operates today, it should be syncing the version (and optionally description with a settings override) field from your package.json file into the manifest so that you shouldn't have to keep those in sync manually. The only other field that the build process messes with is the content-script policies, to make sure that unsafe-eval exists in dev builds and not in production builds to ensure a better local development experience.

The package.json version and description fields sync can be disabled by setting the manifestSync plugin option to an empty array, but you will need to provide those fields manually in the src/manifest.json file. Any other modification you make to the src/manifest.json file should get copied over without being touched by the build process.

adambullmer avatar Mar 31 '20 20:03 adambullmer

Same issue. Add code below to the vue.config.js solved my problem.

chainWebpack(webpackConfig) {
    webpackConfig.plugin('copy-manifest').tap(args => {
      args[0][0].force = true
      return args
    })
  }

Darkylin avatar Apr 02 '20 05:04 Darkylin

@Darkylin did you change the manifestSync option and do you have a version field in your package.json

adambullmer avatar Apr 06 '20 19:04 adambullmer

I came here running into the same problem. For reference, I generated a new project with @vue/cli (4.3.1) and I added this extension with vue add browser-extension (version 0.24.0).

After running npm run serve, the dev server starts successfully but after compiling the dist/manifest.json file is missing the default_locale field as @adrielwerlich mentioned. All I see is:

{
  "name": "test-project",
  "short_name": "test-project",
  "theme_color": "#4DBA87",
  "icons": [
    {
      "src": "./img/icons/android-chrome-192x192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
      "src": "./img/icons/android-chrome-512x512.png",
      "sizes": "512x512",
      "type": "image/png"
    },
    {
      "src": "./img/icons/android-chrome-maskable-192x192.png",
      "sizes": "192x192",
      "type": "image/png",
      "purpose": "maskable"
    },
    {
      "src": "./img/icons/android-chrome-maskable-512x512.png",
      "sizes": "512x512",
      "type": "image/png",
      "purpose": "maskable"
    }
  ],
  "start_url": ".",
  "display": "standalone",
  "background_color": "#000000"
}

To try and help with debugging, I also tried setting manifestSync to [] and defining the version and description fields manually. This exhibits the same behavior as before - a manifest file in the dist folder that doesn't match the manifest in my src folder.

@Darkylin's workaround works for me on the first build every time. However, if I make a change in another file that will cause a reload in development mode (such as src/popup/App.vue), the manifest.json is overwritten with the content that i pasted above.

Happy to help with any more context if needed.

jciruolo avatar Apr 18 '20 16:04 jciruolo

@Darkylin did you change the manifestSync option and do you have a version field in your package.json

Sorry, I had changed my project to electron application and remove this cli plugin. And this bug cannot be reproduced after I create another new project.

Darkylin avatar Jun 06 '20 04:06 Darkylin

I'm pretty sure this is conflict with the PWA module. The PWA module also creates a manifest.json file. I just removed the PWA module and the web extension manifest worked.

npm uninstall @vue/cli-plugin-pwa --save

or

yarn remove @vue/cli-plugin-pwa

of course if you want to use the PWA module then this isn't going to work for you.

DitheringIdiot avatar Jun 10 '20 22:06 DitheringIdiot