Keep contentScripts individual

[jacktang]

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]

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]

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

[jacktang]

@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]

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]

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]

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