diff --git a/karma.conf.js b/karma.conf.js index 303a4b9..3123682 100644 --- a/karma.conf.js +++ b/karma.conf.js @@ -165,9 +165,13 @@ module.exports = (config) => { }), coverage && rollupPluginInstrumentTsCode(), rollupPluginInjectCode({ - 'index.js': { - line: 3, - code: " if ('adoptedStyleSheets' in document) { return; }\n", + insertions: { + 'index.js': [ + { + line: 3, + code: " if ('adoptedStyleSheets' in document) { return; }\n", + }, + ], }, }), ].filter(Boolean), diff --git a/package.json b/package.json index e74bb8a..b328885 100644 --- a/package.json +++ b/package.json @@ -3,12 +3,20 @@ "version": "3.0.6", "description": "Constructible style sheets/adopted style sheets polyfill", "main": "dist/adoptedStyleSheets.js", - "module": "dist/adoptedStyleSheets.js", + "module": "dist/adoptedStyleSheets.mjs", "types": "dist/adoptedStyleSheets.d.ts", "files": [ "dist/adoptedStyleSheets.js", - "dist/adoptedStyleSheets.d.ts" + "dist/adoptedStyleSheets.d.ts", + "dist/adoptedStyleSheets.mjs" ], + "exports": { + ".": { + "import": "dist/adoptedStyleSheets.mjs", + "require": "dist/adoptedStyleSheets.js", + "types": "dist/adoptedStyleSheets.d.ts" + } + }, "scripts": { "build": "rollup -c rollup.config.js", "test": "karma start", diff --git a/plugins/rollup-plugin-inject-code.js b/plugins/rollup-plugin-inject-code.js index e1a7b88..a3a137a 100644 --- a/plugins/rollup-plugin-inject-code.js +++ b/plugins/rollup-plugin-inject-code.js @@ -1,13 +1,26 @@ -module.exports = (options) => ({ +module.exports = ({insertions, processLine = (line) => line}) => ({ name: 'inject-code', async generateBundle(_, assets) { - for (const chunkName in options) { + Object.entries(insertions).forEach(([chunkName, chunkInsertions]) => { const chunk = assets[chunkName]; - const {line, code} = options[chunkName]; - const lines = chunk.code.split('\n'); - lines.splice(line, 0, code); - chunk.code = lines.join('\n'); - } - } + const lines = chunk.code.split('\n').map(processLine); + + for (const {line, code} of chunkInsertions) { + switch (line) { + case -Infinity: + lines.unshift(code); + break; + case Infinity: + lines.push(code); + break; + default: + lines.splice(line, 0, code); + break; + } + + chunk.code = lines.join('\n'); + } + }); + }, }); diff --git a/rollup.config.js b/rollup.config.js index 54c2651..60e68d3 100644 --- a/rollup.config.js +++ b/rollup.config.js @@ -8,11 +8,48 @@ const extensions = ['.ts', '.js']; module.exports = { input: 'src/index.ts', - output: { - file: 'dist/adoptedStyleSheets.js', - format: 'iife', - name: 'adoptedStyleSheets', - }, + output: [ + { + file: 'dist/adoptedStyleSheets.js', + format: 'iife', + name: 'adoptedStyleSheets', + plugins: [ + injectCode({ + insertions: { + 'adoptedStyleSheets.js': [ + { + line: 3, + code: " if (typeof document === 'undefined' || 'adoptedStyleSheets' in document) { return; }\n", + }, + ], + }, + }), + ], + }, + { + file: 'dist/adoptedStyleSheets.mjs', + format: 'esm', + plugins: [ + injectCode({ + insertions: { + 'adoptedStyleSheets.mjs': [ + { + line: -Infinity, + code: "if (typeof document === 'undefined' || 'adoptedStyleSheets' in document) {\n", + }, + { + line: Infinity, + code: '}', + }, + ], + }, + processLine(line) { + return ` ${line}`; + }, + }), + ], + }, + ], plugins: [ nodeResolve({ extensions, @@ -33,12 +70,5 @@ module.exports = { }, ], }), - injectCode({ - 'adoptedStyleSheets.js': { - line: 3, - code: - " if (typeof document === 'undefined' || 'adoptedStyleSheets' in document) { return; }\n", - }, - }), ], };