Skip to content

Commit

Permalink
fix resolving react, refactor exports
Browse files Browse the repository at this point in the history 
closes #3
  • Loading branch information
@adamdbradley
adamdbradley committed Sep 26, 2021
1 parent 9dcb914 commit 63b1e13
Show file tree
Hide file tree
Showing 6 changed files with 106 additions and 51 deletions.
2 changes: 2 additions & 0 deletions .gitignore
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
.cache/
.DS_Store
node_modules/
/index.cjs
/index.mjs
/lib/
/react/
/tests/~partytown/
Expand Down
10 changes: 9 additions & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,15 +3,23 @@
"version": "0.0.3",
"description": "Relocate resource intensive 3rd-party scripts off of the main thread and into a web worker.",
"license": "MIT",
"main": "./index.cjs",
"module": "./index.mjs",
"exports": {
"./react": {
"import": "./react/index.mjs",
"require": "./react/index.cjs"
},
".": {
"import": "./index.mjs",
"require": "./index.cjs"
}
},
"files": [
"/lib/",
"/react/"
"/react/",
"index.cjs",
"index.mjs"
],
"scripts": {
"build": "tsc && rollup -c",
Expand Down
93 changes: 68 additions & 25 deletions rollup.config.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,8 +21,8 @@ export default async function (cmdArgs) {
const srcDir = join(rootDir, 'src');
const srcLibDir = join(srcDir, 'lib');
const srcReactDir = join(srcDir, 'react');
const buildDir = join(rootDir, 'lib');
const testsDir = join(rootDir, 'tests');
const libBuildDir = join(rootDir, 'lib');
const testsBuildDir = join(testsDir, '~partytown');
const reactBuildDir = join(rootDir, 'react');
const cacheDir = join(rootDir, '.cache');
Expand Down Expand Up @@ -64,7 +64,7 @@ export default async function (cmdArgs) {
};

if (!isDev) {
await emptyDir(buildDir);
await emptyDir(libBuildDir);
await emptyDir(reactBuildDir);
await emptyDir(testsBuildDir);
await emptyDir(join(testsDir, 'videos'));
Expand Down Expand Up @@ -99,7 +99,7 @@ export default async function (cmdArgs) {

const webWorkerCode = generated.output[0].code;
if (debug) {
await writeFile(join(buildDir, `partytown-ww.debug.js`), webWorkerCode);
await writeFile(join(libBuildDir, `partytown-ww.debug.js`), webWorkerCode);
} else {
await writeFile(join(cacheDir, `partytown-ww.js`), webWorkerCode);
}
Expand Down Expand Up @@ -150,7 +150,7 @@ export default async function (cmdArgs) {
const sandboxJsCode = generated.output[0].code;
let sandboxHtml;
if (debug) {
await writeFile(join(buildDir, `partytown-sandbox.debug.js`), sandboxJsCode);
await writeFile(join(libBuildDir, `partytown-sandbox.debug.js`), sandboxJsCode);

sandboxHtml = `<!DOCTYPE html><html><head><meta charset="utf-8"><script src="./partytown-sandbox.debug.js"></script></head></html>`;
await writeFile(join(cacheDir, `partytown-sandbox.debug.html`), sandboxHtml);
Expand All @@ -164,7 +164,7 @@ export default async function (cmdArgs) {

async function serviceWorker() {
const swDebug = {
file: join(buildDir, 'partytown-sw.debug.js'),
file: join(libBuildDir, 'partytown-sw.debug.js'),
format: 'es',
exports: 'none',
plugins: [terser(debugOpts)],
Expand All @@ -173,7 +173,7 @@ export default async function (cmdArgs) {
const output = [swDebug];
if (!isDev) {
output.push({
file: join(buildDir, 'partytown-sw.js'),
file: join(libBuildDir, 'partytown-sw.js'),
format: 'es',
exports: 'none',
plugins: [managlePropsPlugin(), terser(minOpts), fileSize()],
Expand Down Expand Up @@ -219,7 +219,7 @@ export default async function (cmdArgs) {
}
},
writeBundle() {
copySync(buildDir, testsBuildDir);
copySync(libBuildDir, testsBuildDir);
},
},
],
Expand All @@ -228,14 +228,14 @@ export default async function (cmdArgs) {

function main() {
const partytownDebug = {
file: join(buildDir, 'partytown.debug.js'),
file: join(libBuildDir, 'partytown.debug.js'),
format: 'es',
exports: 'none',
plugins: [terser(debugOpts)],
};

const partytownMin = {
file: join(buildDir, 'partytown.js'),
file: join(libBuildDir, 'partytown.js'),
format: 'es',
exports: 'none',
plugins: [terser(minOpts), fileSize()],
Expand All @@ -256,7 +256,7 @@ export default async function (cmdArgs) {
}),
{
writeBundle() {
copySync(buildDir, testsBuildDir);
copySync(libBuildDir, testsBuildDir);
},
},
],
Expand All @@ -265,14 +265,14 @@ export default async function (cmdArgs) {

function snippet() {
const partytownDebug = {
file: join(buildDir, 'partytown-snippet.debug.js'),
file: join(libBuildDir, 'partytown-snippet.debug.js'),
format: 'iife',
exports: 'none',
plugins: [terser(debugOpts)],
};

const partytownMin = {
file: join(buildDir, 'partytown-snippet.js'),
file: join(libBuildDir, 'partytown-snippet.js'),
format: 'es',
exports: 'none',
plugins: [
Expand Down Expand Up @@ -305,7 +305,46 @@ export default async function (cmdArgs) {
}),
{
writeBundle() {
copySync(buildDir, testsBuildDir);
copySync(libBuildDir, testsBuildDir);
},
},
],
};
}

function defaultExport() {
const output = [
{
file: join(rootDir, 'index.cjs'),
format: 'cjs',
},
{
file: join(rootDir, 'index.mjs'),
format: 'es',
},
];

return {
input: join(srcDir, 'index.ts'),
output,
plugins: [
typescript({
cacheDir: join(cacheDir, 'default'),
outputToFilesystem: false,
}),
{
name: 'snippet',
resolveId(id) {
if (id.startsWith('@')) return id;
},
async load(id) {
if (id === '@snippet') {
const codeFile = 'partytown-snippet.js';
const code = readFileSync(join(libBuildDir, codeFile), 'utf-8').trim();
return `const PartytownSnippet = ${JSON.stringify(
code
)}; export default PartytownSnippet;`;
}
},
},
],
Expand Down Expand Up @@ -341,22 +380,26 @@ export default async function (cmdArgs) {
],
external: ['react'],
plugins: [
{
resolveId(id) {
if (id === '../index') {
return {
external: true,
id,
};
}
},
},
typescript({
cacheDir: join(cacheDir, 'react'),
outputToFilesystem: false,
}),
{
name: 'reactSnippet',
resolveId(id) {
if (id.startsWith('@')) return id;
},
async load(id) {
if (id === '@snippet') {
const codeFile = isDev ? 'partytown-snippet.debug.js' : 'partytown-snippet.js';
const code = readFileSync(join(buildDir, codeFile), 'utf-8').trim();
return `const PartytownSnippet = ${JSON.stringify(
code
)}; export default PartytownSnippet;`;
name: 'moduleExtension',
generateBundle(opts, bundle) {
const ext = opts.format === 'cjs' ? 'cjs' : 'mjs';
for (const f in bundle) {
bundle[f].code = bundle[f].code.replace(`../index`, `../index.${ext}`);
}
},
},
Expand All @@ -371,7 +414,7 @@ export default async function (cmdArgs) {
};
}

return [await serviceWorker(), main(), snippet(), react()];
return [await serviceWorker(), main(), snippet(), defaultExport(), react()];
}

function managlePropsPlugin() {
Expand Down
18 changes: 18 additions & 0 deletions src/index.ts
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
import PartytownSnippet from '@snippet';
import type { PartytownConfig } from './lib/types';

export const partytownSnippet = (config: PartytownConfig) => {
const forward = config.forward || [];
delete config.forward;

return [
`(function(w,p,f,c){`,
config && Object.keys(config).length > 0
? `c=w[p]=Object.assign(w[p]||{},${JSON.stringify(config)});`
: `c=w[p]=w[p]||{};`,
`c[f]=(c[f]||[])`,
forward.length > 0 ? `.concat(${JSON.stringify(forward)})` : ``,
`})(window,'partytown','forward');`,
PartytownSnippet,
].join('');
};
0 src/lib/modules.d.ts → src/modules.d.ts
View file
File renamed without changes.
34 changes: 9 additions & 25 deletions src/react/partytown.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import React from 'react';
import type { PartytownConfig } from '../lib/types';
import PartytownSnippet from '@snippet';
import { partytownSnippet } from '../index';

/**
* Props for `<Partytown/>`, which extends the Partytown Config.
Expand All @@ -17,27 +17,11 @@ export interface PartytownProps extends PartytownConfig {}
*
* @public
*/
export const Partytown = (props?: PartytownProps): any => {
props = { ...props };
const forward = props.forward || [];
delete props.forward;

const config = [
`(function(w,p,f,c){`,
Object.keys(props).length > 0
? `c=w[p]=Object.assign(w[p]||{},${JSON.stringify(props)});`
: `c=w[p]=w[p]||{};`,
`c[f]=(c[f]||[])`,
forward.length > 0 ? `.concat(${JSON.stringify(forward)})` : ``,
`})(window,'partytown','forward');`,
];

return (
<script
data-partytown="lib"
dangerouslySetInnerHTML={{
__html: config.join('') + PartytownSnippet,
}}
/>
);
};
export const Partytown = (props?: PartytownProps): any => (
<script
data-partytown="lib"
dangerouslySetInnerHTML={{
__html: partytownSnippet({ ...props }),
}}
/>
);

1 comment on commit 63b1e13

@vercel
Copy link

@vercel vercel bot commented on 63b1e13 Sep 26, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

Please sign in to comment.