From 5b07c95ec727df670c0133d1b803da578ed6b2d6 Mon Sep 17 00:00:00 2001 From: Aaron Klinker Date: Wed, 21 Jun 2023 16:02:43 -0500 Subject: [PATCH] feat: Export and bootstrap the `/client` package --- demo/entrypoints/background.ts | 6 ++++ demo/entrypoints/options/index.html | 13 ++++++++ demo/entrypoints/options/main.ts | 3 ++ demo/entrypoints/options/style.css | 4 +++ demo/entrypoints/overlay.content.ts | 11 +++++++ demo/entrypoints/popup.html | 11 +++++++ demo/package.json | 7 +++-- demo/tsconfig.json | 4 +++ demo/utils/logger.ts | 1 + package.json | 10 ++++-- src/cli.ts | 47 ---------------------------- src/client/defineBackgroundScript.ts | 14 +++++++++ src/client/defineContentScript.ts | 7 +++++ src/client/index.ts | 3 ++ src/client/mountContentScriptUi.ts | 3 ++ 15 files changed, 92 insertions(+), 52 deletions(-) create mode 100644 demo/entrypoints/background.ts create mode 100644 demo/entrypoints/options/index.html create mode 100644 demo/entrypoints/options/main.ts create mode 100644 demo/entrypoints/options/style.css create mode 100644 demo/entrypoints/overlay.content.ts create mode 100644 demo/entrypoints/popup.html create mode 100644 demo/tsconfig.json create mode 100644 demo/utils/logger.ts delete mode 100644 src/cli.ts create mode 100644 src/client/defineBackgroundScript.ts create mode 100644 src/client/defineContentScript.ts create mode 100644 src/client/index.ts create mode 100644 src/client/mountContentScriptUi.ts diff --git a/demo/entrypoints/background.ts b/demo/entrypoints/background.ts new file mode 100644 index 000000000..37774960f --- /dev/null +++ b/demo/entrypoints/background.ts @@ -0,0 +1,6 @@ +import { defineBackgroundScript } from 'exvite/client'; +import browser from 'webextension-polyfill'; + +export default defineBackgroundScript(() => { + console.log(browser.runtime.id); +}); diff --git a/demo/entrypoints/options/index.html b/demo/entrypoints/options/index.html new file mode 100644 index 000000000..0a57a3027 --- /dev/null +++ b/demo/entrypoints/options/index.html @@ -0,0 +1,13 @@ + + + + + + Extension Settings + + + +

Hello options page!

+ + + diff --git a/demo/entrypoints/options/main.ts b/demo/entrypoints/options/main.ts new file mode 100644 index 000000000..6dd6c10ed --- /dev/null +++ b/demo/entrypoints/options/main.ts @@ -0,0 +1,3 @@ +import browser from 'webextension-polyfill'; + +console.log(browser.runtime.id); diff --git a/demo/entrypoints/options/style.css b/demo/entrypoints/options/style.css new file mode 100644 index 000000000..f129d8613 --- /dev/null +++ b/demo/entrypoints/options/style.css @@ -0,0 +1,4 @@ +html { + background: black; + color: white; +} diff --git a/demo/entrypoints/overlay.content.ts b/demo/entrypoints/overlay.content.ts new file mode 100644 index 000000000..a5891d434 --- /dev/null +++ b/demo/entrypoints/overlay.content.ts @@ -0,0 +1,11 @@ +import { defineContentScript, mountContentScriptUi } from 'exvite/client'; +import browser from 'webextension-polyfill'; + +export default defineContentScript({ + matches: ['*://*/*'], + async main() { + console.log(browser.runtime.id); + + mountContentScriptUi(); + }, +}); diff --git a/demo/entrypoints/popup.html b/demo/entrypoints/popup.html new file mode 100644 index 000000000..53cb0387e --- /dev/null +++ b/demo/entrypoints/popup.html @@ -0,0 +1,11 @@ + + + + + + Popup + + +

Hello popup!

+ + diff --git a/demo/package.json b/demo/package.json index 9f4d62604..163d83f98 100644 --- a/demo/package.json +++ b/demo/package.json @@ -5,10 +5,11 @@ "build": "pnpm -w build && exvite build", "prepare": "pnpm -w build && exvite prepare" }, + "dependencies": { + "webextension-polyfill": "^0.10.0" + }, "devDependencies": { + "@types/webextension-polyfill": "^0.10.0", "exvite": "workspace:*" - }, - "dependencies": { - "unimport": "^3.0.8" } } diff --git a/demo/tsconfig.json b/demo/tsconfig.json new file mode 100644 index 000000000..cf8118394 --- /dev/null +++ b/demo/tsconfig.json @@ -0,0 +1,4 @@ +{ + "extends": "../tsconfig.base.json", + "exclude": [".output"] +} diff --git a/demo/utils/logger.ts b/demo/utils/logger.ts new file mode 100644 index 000000000..34cc54b56 --- /dev/null +++ b/demo/utils/logger.ts @@ -0,0 +1 @@ +export default console; diff --git a/package.json b/package.json index fa593db23..f1ea543bd 100644 --- a/package.json +++ b/package.json @@ -16,7 +16,7 @@ "files": [ "dist" ], - "bin": "dist/cli.cjs", + "bin": "dist/cli/index.cjs", "main": "./dist/index.cjs", "module": "./dist/index.js", "types": "./dist/index.d.ts", @@ -25,13 +25,19 @@ "require": "./dist/index.cjs", "import": "./dist/index.js", "types": "./dist/index.d.ts" + }, + "./client": { + "require": "./dist/client/index.cjs", + "import": "./dist/client/index.js", + "types": "./dist/client/index.d.ts" } }, "scripts": { "dev": "tsx src/cli.ts", "build": "run-s build:*", "build:js": "tsup src/index.ts --clean --sourcemap --dts --format esm,cjs", - "build:cli": "tsup src/cli.ts", + "build:cli": "tsup src/cli/index.ts -d dist/cli --sourcemap", + "build:client": "tsup src/client/index.ts -d dist/client --sourcemap --dts --format esm,cjs", "format": "prettier --write .", "format:check": "prettier --write .", "prepare": "simple-git-hooks" diff --git a/src/cli.ts b/src/cli.ts deleted file mode 100644 index 641dd4caf..000000000 --- a/src/cli.ts +++ /dev/null @@ -1,47 +0,0 @@ -#!/usr/bin/env node - -import cac from 'cac'; -import { version } from '../package.json'; -import * as commands from './commands'; - -const cli = cac('exvite'); -cli.help(); -cli.version(version); - -// DEV -cli - .command('[root]', 'start dev server') - .option('-c, --config ', 'use specified config file') - .option('-b, --browser ', 'specify a browser', { - type: ['chrome', 'firefox'], - }) - .option('-m, --mode ', 'set env mode', { - default: 'development', - }) - .action(commands.dev); - -// BUILD -cli - .command('build [root]', 'build for production') - .option('-c, --config ', 'use specified config file') - .option('-m, --mode ', 'set env mode') - .action(commands.build); - -// PREPARE -cli - .command('prepare [root]', 'prepare') - .option('-c, --config ', 'use specified config file') - .option('-m, --mode ', 'set env mode', { - default: 'production', - }) - .action(commands.prepare); - -// PUBLISH -cli.command('publish [root]', 'publish to stores').action(commands.publish); - -// INIT -cli - .command('init [directory]', 'initialize a new project') - .action(commands.init); - -cli.parse(); diff --git a/src/client/defineBackgroundScript.ts b/src/client/defineBackgroundScript.ts new file mode 100644 index 000000000..f112b910c --- /dev/null +++ b/src/client/defineBackgroundScript.ts @@ -0,0 +1,14 @@ +import { BackgroundScriptDefintition } from '..'; + +export function defineBackgroundScript( + main: () => void, +): BackgroundScriptDefintition; +export function defineBackgroundScript( + definition: BackgroundScriptDefintition, +): BackgroundScriptDefintition; +export function defineBackgroundScript( + arg: (() => void) | BackgroundScriptDefintition, +): BackgroundScriptDefintition { + if (typeof arg === 'function') return { main: arg }; + return arg; +} diff --git a/src/client/defineContentScript.ts b/src/client/defineContentScript.ts new file mode 100644 index 000000000..7d93d19a1 --- /dev/null +++ b/src/client/defineContentScript.ts @@ -0,0 +1,7 @@ +import { ContentScriptDefinition } from '../types'; + +export function defineContentScript( + definition: ContentScriptDefinition, +): ContentScriptDefinition { + return definition; +} diff --git a/src/client/index.ts b/src/client/index.ts new file mode 100644 index 000000000..2bd0fde25 --- /dev/null +++ b/src/client/index.ts @@ -0,0 +1,3 @@ +export * from './defineContentScript'; +export * from './defineBackgroundScript'; +export * from './mountContentScriptUi'; diff --git a/src/client/mountContentScriptUi.ts b/src/client/mountContentScriptUi.ts new file mode 100644 index 000000000..ccc2fff8d --- /dev/null +++ b/src/client/mountContentScriptUi.ts @@ -0,0 +1,3 @@ +export function mountContentScriptUi() { + throw Error('Not implemented: mountContentScriptUi'); +}