diff --git a/.changeset/config.json b/.changeset/config.json index 581533f27..f2091dd84 100644 --- a/.changeset/config.json +++ b/.changeset/config.json @@ -6,6 +6,5 @@ "linked": [], "access": "public", "baseBranch": "main", - "updateInternalDependencies": "patch", - "ignore": ["community-addon-template"] + "updateInternalDependencies": "patch" } diff --git a/.changeset/flat-frogs-stop.md b/.changeset/flat-frogs-stop.md new file mode 100644 index 000000000..a83610009 --- /dev/null +++ b/.changeset/flat-frogs-stop.md @@ -0,0 +1,9 @@ +--- +'sv': minor +--- + +feat: community addons are now in preview + +- new template `addon` available for creating community add-ons `npx sv create --template addon [path]` +- new command available, to add community addons `npx sv add @[ORG]` and `npx sv add file:[path]` +- request for feedback on the community addons process! diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index 2044f9638..ef4c6226e 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -54,3 +54,28 @@ jobs: - run: pnpm exec playwright install chromium - run: pnpm build - run: pnpm test + preview-release: + if: github.repository == 'sveltejs/cli' && github.event_name == 'pull_request' + needs: [lint, check] + timeout-minutes: 30 + runs-on: ubuntu-latest + steps: + - name: checkout code repository + uses: actions/checkout@v4 + + - uses: pnpm/action-setup@v4 + + - name: setup node.js + uses: actions/setup-node@v4 + with: + node-version: 20 + cache: pnpm + + - name: install dependencies + run: pnpm install + + - name: build + run: pnpm build + + - name: publish preview + run: pnpm dlx pkg-pr-new@0.0 publish --bin --pnpm './packages/*' diff --git a/.github/workflows/preview-release.yml b/.github/workflows/preview-release.yml deleted file mode 100644 index d6ffd5f2b..000000000 --- a/.github/workflows/preview-release.yml +++ /dev/null @@ -1,29 +0,0 @@ -name: Publish Preview Release -on: - pull_request: - -jobs: - preview-release: - if: github.repository == 'sveltejs/cli' - timeout-minutes: 30 - runs-on: ubuntu-latest - steps: - - name: checkout code repository - uses: actions/checkout@v4 - - - uses: pnpm/action-setup@v4 - - - name: setup node.js - uses: actions/setup-node@v4 - with: - node-version: 20 - cache: pnpm - - - name: install dependencies - run: pnpm install - - - name: build - run: pnpm build - - - name: publish preview - run: pnpm dlx pkg-pr-new@0.0 publish --bin --pnpm './packages/*' diff --git a/community-addon-template/.gitignore b/community-addon-template/.gitignore deleted file mode 100644 index a9e1699a5..000000000 --- a/community-addon-template/.gitignore +++ /dev/null @@ -1,4 +0,0 @@ -node_modules -temp -.outputs -.test-output diff --git a/community-addon-template/README.md b/community-addon-template/README.md deleted file mode 100644 index 20f69acae..000000000 --- a/community-addon-template/README.md +++ /dev/null @@ -1,58 +0,0 @@ -# community-addon-template - -> [!IMPORTANT] -> Community add-ons are currently not supported. Please see [#184](https://github.com/sveltejs/cli/issues/184) for details. - -> [!IMPORTANT] -> This template's dependencies may not be up-to-date; be sure to update them to the latest! -> If you get stuck, check out the [implementations of official add-ons](https://github.com/sveltejs/cli/tree/main/packages/add-ons). - -The add-on template for community add-ons for [`sv`](https://github.com/sveltejs/cli). - -## Cloning the template - -Use [`degit`](https://github.com/Rich-Harris/degit) to clone the template: - -```shell -npx degit sveltejs/cli/community-addon-template addon-name -``` - -## Using the add-on - -To run the add-on, we'll first need a project to apply it to. - -Create the project with the following script: - -```shell -npm run create-temp -``` - -This will create a SvelteKit project in the `temp` directory. - -To execute the add-on, run: - -```shell -npm start -``` - -## Sharing your add-on - -When you're ready to publish your add-on to npm, run: - -```shell -npm publish -``` - -Your published add-on can now be used by anyone! - -To execute the newly published package with `sv`, run: - -```shell -npx sv add --community npm:addon-package-name -``` - -After that, feel free to open a pull request to [`sv`](https://github.com/sveltejs/cli) and add your add-on to the [community list](/community-addons/). - -## Things to be aware of - -Community add-ons are **not permitted** to have any external dependencies outside of `sv`. If the use of a dependency is absolutely necessary, then they can be bundled using a bundler of your choosing (e.g. Rollup, Rolldown, tsup, etc.). diff --git a/community-addon-template/package.json b/community-addon-template/package.json deleted file mode 100644 index c6802149c..000000000 --- a/community-addon-template/package.json +++ /dev/null @@ -1,28 +0,0 @@ -{ - "name": "community-addon-template", - "private": true, - "version": "0.0.0", - "type": "module", - "license": "MIT", - "scripts": { - "create-temp": "sv create temp --types ts --template minimal --no-add-ons --no-install", - "start": "sv add -C temp --community file:../", - "test": "vitest run" - }, - "files": [ - "src", - "!src/**/*.test.*" - ], - "exports": "./src/index.js", - "dependencies": { - "sv": "workspace:*" - }, - "devDependencies": { - "@playwright/test": "^1.57.0", - "vitest": "4.0.15" - }, - "keywords": [ - "svelte-add-on", - "sv" - ] -} diff --git a/community-addon-template/src/index.js b/community-addon-template/src/index.js deleted file mode 100644 index 3c2f5ee50..000000000 --- a/community-addon-template/src/index.js +++ /dev/null @@ -1,33 +0,0 @@ -import { defineAddon, defineAddonOptions, js, svelte, parseSvelte } from 'sv/core'; - -export const options = defineAddonOptions() - .add('demo', { - question: 'Do you want to use a demo?', - type: 'boolean', - default: false - }) - .build(); - -export default defineAddon({ - id: 'community-addon', - options, - setup: ({ kit, unsupported }) => { - if (!kit) unsupported('Requires SvelteKit'); - }, - run: ({ sv, options, typescript }) => { - sv.file('addon-template-demo.txt', (content) => { - if (options.demo) { - return 'This is a text file made by the Community Addon Template demo!'; - } - return content; - }); - - sv.file('src/DemoComponent.svelte', (content) => { - if (!options.demo) return content; - const { ast, generateCode } = parseSvelte(content); - const scriptAst = svelte.ensureScript(ast, { langTs: typescript }); - js.imports.addDefault(scriptAst, { from: '../addon-template-demo.txt?raw', as: 'demo' }); - return generateCode(); - }); - } -}); diff --git a/community-addon-template/tests/custom-addon.test.ts b/community-addon-template/tests/custom-addon.test.ts deleted file mode 100644 index 8cc944167..000000000 --- a/community-addon-template/tests/custom-addon.test.ts +++ /dev/null @@ -1,34 +0,0 @@ -import path from 'node:path'; -import { expect } from '@playwright/test'; -import { fixture, setupTest } from './setup/suite.js'; -import addon from '../src/index.js'; - -const id = addon.id; -const { test, addonTestCases, prepareServer } = setupTest( - { [id]: addon }, - { kinds: [{ type: 'default', options: { [id]: { demo: true } } }] } -); - -test.concurrent.for(addonTestCases)( - 'community-addon $variant', - async (addonTestCase, { page, ...ctx }) => { - const cwd = ctx.cwd(addonTestCase); - - // ...add files - if (addonTestCase.variant.startsWith('kit')) { - const target = path.resolve(cwd, 'src', 'routes', '+page.svelte'); - fixture({ name: '+page.svelte', target }); - } else { - const target = path.resolve(cwd, 'src', 'App.svelte'); - fixture({ name: 'App.svelte', target }); - } - - const { close } = await prepareServer({ cwd, page }); - // kill server process when we're done - ctx.onTestFinished(async () => await close()); - - // expectations - const textContent = await page.getByTestId('demo').textContent(); - expect(textContent).toContain('This is a text file made by the Community Addon Template demo!'); - } -); diff --git a/community-addon-template/tests/fixtures/+page.svelte b/community-addon-template/tests/fixtures/+page.svelte deleted file mode 100644 index 59a30f613..000000000 --- a/community-addon-template/tests/fixtures/+page.svelte +++ /dev/null @@ -1,5 +0,0 @@ - - -{demo} diff --git a/community-addon-template/tests/fixtures/App.svelte b/community-addon-template/tests/fixtures/App.svelte deleted file mode 100644 index 13271b83e..000000000 --- a/community-addon-template/tests/fixtures/App.svelte +++ /dev/null @@ -1,5 +0,0 @@ - - -{demo} diff --git a/community-addon-template/tests/setup/global.ts b/community-addon-template/tests/setup/global.ts deleted file mode 100644 index a9cbb495c..000000000 --- a/community-addon-template/tests/setup/global.ts +++ /dev/null @@ -1,29 +0,0 @@ -import { fileURLToPath } from 'node:url'; -import { setup, type ProjectVariant } from 'sv/testing'; -import type { TestProject } from 'vitest/node'; - -const TEST_DIR = fileURLToPath(new URL('../../.test-output/', import.meta.url)); -const variants: ProjectVariant[] = ['kit-js', 'kit-ts', 'vite-js', 'vite-ts']; - -export default async function ({ provide }: TestProject) { - // global setup (e.g. spin up docker containers) - - // downloads different project configurations (sveltekit, js/ts, vite-only, etc) - const { templatesDir } = await setup({ cwd: TEST_DIR, variants, clean: true }); - - provide('testDir', TEST_DIR); - provide('templatesDir', templatesDir); - provide('variants', variants); - - return async () => { - // tear down... (e.g. cleanup docker containers) - }; -} - -declare module 'vitest' { - export interface ProvidedContext { - testDir: string; - templatesDir: string; - variants: ProjectVariant[]; - } -} diff --git a/community-addon-template/tests/setup/suite.ts b/community-addon-template/tests/setup/suite.ts deleted file mode 100644 index 962f3d776..000000000 --- a/community-addon-template/tests/setup/suite.ts +++ /dev/null @@ -1,173 +0,0 @@ -import fs from 'node:fs'; -import path from 'node:path'; -import { execSync } from 'node:child_process'; -import * as vitest from 'vitest'; -import { installAddon, type AddonMap, type OptionMap } from 'sv'; -import { - createProject, - startPreview, - addPnpmBuildDependencies, - type CreateProject, - type ProjectVariant -} from 'sv/testing'; -import { chromium, type Browser, type BrowserContext, type Page } from '@playwright/test'; -import { fileURLToPath } from 'node:url'; - -const cwd = vitest.inject('testDir'); -const templatesDir = vitest.inject('templatesDir'); -const variants = vitest.inject('variants'); - -const SETUP_DIR = fileURLToPath(new URL('.', import.meta.url)); - -type Fixtures = { - page: Page; - cwd(addonTestCase: AddonTestCase): string; -}; - -type AddonTestCase = { - variant: ProjectVariant; - kind: { type: string; options: OptionMap }; -}; - -export function setupTest( - addons: Addons, - options?: { - kinds: Array['kind']>; - filter?: (addonTestCase: AddonTestCase) => boolean; - browser?: boolean; - } -) { - const test = vitest.test.extend({} as any); - - const withBrowser = options?.browser ?? true; - - let create: CreateProject; - let browser: Browser; - - if (withBrowser) { - vitest.beforeAll(async () => { - browser = await chromium.launch(); - return async () => { - await browser.close(); - }; - }); - } - - const addonTestCases: Array> = []; - for (const kind of options?.kinds ?? []) { - for (const variant of variants) { - const addonTestCase = { variant, kind }; - if (!options?.filter || options?.filter?.(addonTestCase)) { - addonTestCases.push(addonTestCase); - } - } - } - let testName: string; - vitest.beforeAll(async ({ name }) => { - testName = path.dirname(name).split('/').at(-1)!; - - // constructs a builder for create test projects - create = createProject({ cwd, templatesDir, testName }); - - // creates a pnpm workspace in each addon dir - fs.writeFileSync( - path.resolve(cwd, testName, 'pnpm-workspace.yaml'), - "packages:\n - '**/*'", - 'utf8' - ); - - // creates a barebones package.json in each addon dir - fs.writeFileSync( - path.resolve(cwd, testName, 'package.json'), - JSON.stringify({ - name: `${testName}-workspace-root`, - private: true - }) - ); - - for (const { variant, kind } of addonTestCases) { - const cwd = create({ testId: `${kind.type}-${variant}`, variant }); - - // test metadata - const metaPath = path.resolve(cwd, 'meta.json'); - fs.writeFileSync(metaPath, JSON.stringify({ variant, kind }, null, '\t'), 'utf8'); - - const { pnpmBuildDependencies } = await installAddon({ - cwd, - addons, - options: kind.options, - packageManager: 'pnpm' - }); - await addPnpmBuildDependencies(cwd, 'pnpm', ['esbuild', ...pnpmBuildDependencies]); - } - - execSync('pnpm install', { cwd: path.resolve(cwd, testName), stdio: 'pipe' }); - }); - - // runs before each test case - vitest.beforeEach(async (ctx) => { - let browserCtx: BrowserContext; - if (withBrowser) { - browserCtx = await browser.newContext(); - ctx.page = await browserCtx.newPage(); - } - - ctx.cwd = (addonTestCase) => { - return path.join(cwd, testName, `${addonTestCase.kind.type}-${addonTestCase.variant}`); - }; - - return async () => { - if (withBrowser) { - await browserCtx.close(); - } - // ...other tear downs - }; - }); - - return { test, addonTestCases, prepareServer }; -} - -type PrepareServerOptions = { - cwd: string; - page: Page; - buildCommand?: string; - previewCommand?: string; -}; -// installs dependencies, builds the project, and spins up the preview server -async function prepareServer({ - cwd, - page, - buildCommand = 'pnpm build', - previewCommand = 'pnpm preview' -}: PrepareServerOptions) { - // build project - if (buildCommand) execSync(buildCommand, { cwd, stdio: 'pipe' }); - - // start preview server - const { url, close } = await startPreview({ cwd, command: previewCommand }); - - // increases timeout as 30s is not always enough when running the full suite - page.setDefaultNavigationTimeout(60_000); - - try { - // navigate to the page - await page.goto(url); - } catch (e) { - // cleanup in the instance of a timeout - await close(); - throw e; - } - - return { url, close }; -} - -/** - * Applies a fixture to the target path - */ -export function fixture({ name, target }: { name: string; target: string }) { - const fixturePath = path.resolve(SETUP_DIR, '..', 'fixtures', name); - if (!fs.existsSync(fixturePath)) { - throw new Error(`Fixture does not exist at: ${fixturePath}`); - } - fs.copyFileSync(fixturePath, target); -} diff --git a/community-addons/unocss.ts b/community-addons/unocss.ts deleted file mode 100644 index 2fcf820cd..000000000 --- a/community-addons/unocss.ts +++ /dev/null @@ -1,5 +0,0 @@ -import type { CommunityAddon } from '../packages/addons/_config/community.ts'; - -export default { - id: 'unocss-svelte-add-on' -} satisfies CommunityAddon; diff --git a/community-addons/unplugin-icons.ts b/community-addons/unplugin-icons.ts deleted file mode 100644 index 2593656fb..000000000 --- a/community-addons/unplugin-icons.ts +++ /dev/null @@ -1,5 +0,0 @@ -import type { CommunityAddon } from '../packages/addons/_config/community.ts'; - -export default { - id: 'unplugin-icons-svelte-add-on' -} satisfies CommunityAddon; diff --git a/documentation/docs/20-commands/10-sv-create.md b/documentation/docs/20-commands/10-sv-create.md index 2ac49088c..24ca665a0 100644 --- a/documentation/docs/20-commands/10-sv-create.md +++ b/documentation/docs/20-commands/10-sv-create.md @@ -29,6 +29,7 @@ Which project template to use: - `minimal` — barebones scaffolding for your new app - `demo` — showcase app with a word guessing game that works without JavaScript - `library` — template for a Svelte library, set up with `svelte-package` +- `addon` — template for a community add-on, ready to be tested & published ### `--types