[mv3] Using this package from a chrome.scripting.executeScript file

[knoid]

Hello again! Following up the discussion at crxjs/chrome-extension-tools#124. I'm now trying to use @extend-chome/messages and the built file ends up importing another file like this:

import { s as sendNumber } from './chunks/messages-2397a427.js';

This, in turn, throws Cannot use import statement outside a module. As you already may know from the linked issue, content-script.ts was added as an input file in rollup.config.js. I tried returning an array from rollup config by having a configuration for content-script.ts and another for manifest.ts and that kind of works but simpleReloader is now working right.

rollup.config.js looks like this:

import path from 'path'

import resolve from '@rollup/plugin-node-resolve'
import commonjs from '@rollup/plugin-commonjs'
import typescript from '@rollup/plugin-typescript'

import { chromeExtension, simpleReloader } from 'rollup-plugin-chrome-extension'
import { emptyDir } from 'rollup-plugin-empty-dir'
import zip from 'rollup-plugin-zip'
import replace from '@rollup/plugin-replace'

const isProduction = process.env.NODE_ENV === 'production'

export default {
  input: ['src/manifest.ts', 'src/content-script.ts'],
  output: {
    dir: 'dist',
    format: 'esm',
    chunkFileNames: path.join('chunks', '[name]-[hash].js'),
  },
  plugins: [
    replace({
      'process.env.NODE_ENV': isProduction
        ? JSON.stringify('production')
        : JSON.stringify('development'),
      preventAssignment: true,
    }),
    chromeExtension(),
    // Adds a Chrome extension reloader during watch mode
    simpleReloader(),
    resolve(),
    commonjs(),
    typescript(),
    // Empties the output dir before a new build
    emptyDir(),
    // Outputs a zip file in ./releases
    isProduction && zip({ dir: 'releases' }),
  ],
}

Thank you!

[jacksteamdev]

Makes sense. Rollup outputs the content script as ESM, but Chrome Extensions don't support static imports in content scripts. There are workarounds, but they get complicated quick, so I think the best solution for now is to output the content script in a different format (IIFE works well).

[jacksteamdev]

A full rewrite of rollup-plugin-chrome-extension is in beta, and I'm going to add support for the new Scripting API. Thanks for letting me know about your use case!

I'll let you know when it's ready: crxjs/chrome-extension-tools#117

[jacksteamdev]

@knoid Sorry, I re-read your issue and updated my response. Looks like you did what I would do! 😅