antfu-collective / vitesse-webext

⚡️ WebExtension Vite Starter Template
MIT License
2.89k stars 223 forks source link

Keep contentScripts individual #54

Open jacktang opened 2 years ago

jacktang commented 2 years ago

Hi,

I find the vitesse-webext project contains only one index.global.js under contentScripts. If I want to keep contentScript individual, what should I do?

There are some build configs in vite.config.content.ts file, but I not so familiar with vite, could you please give me some example?

jacktang commented 2 years ago

I've tried edit the build config in vite.config.ts

  build: {
    outDir: r('extension/dist'),
    emptyOutDir: false,
    sourcemap: isDev ? 'inline' : false,
    // https://developer.chrome.com/docs/webstore/program_policies/#:~:text=Code%20Readability%20Requirements
    terserOptions: {
      mangle: false,
    },
    rollupOptions: {
      input: {
        background: r('src/background/index.html'),
        options: r('src/options/index.html'),
        popup: r('src/popup/index.html'),
        'contentScripts/parser': r('src/contentScripts/parser/*.ts'),
      },
    },
  },

but no luck, it didn't work at all :(

tmkx commented 2 years ago

content-scripts were defined at vite.config.content.ts for now.

jacktang commented 2 years ago

@tmkx yep, I also tried vite.config.content.ts

    rollupOptions: {
      output: {
        entryFileNames: 'index.global.js',
        extend: true,
      },
      input: {
         'parser': r('src/contentScripts/parser/*.ts'),
      },
    },

But it didn't copy the ts files under parser dir.

jacktang commented 2 years ago

Let clear the question again. I want to keep vue component in current index.ts and keep other content scripts in individual files because they will be inserted into tab page in different life cycle and with different functions.

tmkx commented 2 years ago

it does not support multi entrypoints(or glob) yet. There are some ways to do that:

  1. bundle all components into contentScripts/index.ts, and use them at your needs
  2. copy vite.config.content.ts, and change build.lib.entry, manifest.ts to add a new content-script file
louisremi commented 1 year ago

@tmkx it would be really great to have a working example of that, as I'm a complete vite.config noob