From 9983f1a63f10630a424eb5d48d364a479c3362cc Mon Sep 17 00:00:00 2001 From: Jiahan Chen Date: Sat, 8 Aug 2026 15:07:48 +0800 Subject: [PATCH 01/76] feat(create-rstack): add Vue library templates (#248) --- packages/create-rstack/README.md | 2 + packages/create-rstack/src/index.ts | 3 ++ .../template-lib-vue-js/AGENTS.md | 14 +++++++ .../template-lib-vue-js/README.md | 40 ++++++++++++++++++ .../template-lib-vue-js/package.json | 37 ++++++++++++++++ .../template-lib-vue-js/rstack.config.js | 30 +++++++++++++ .../template-lib-vue-js/src/Button.vue | 41 ++++++++++++++++++ .../template-lib-vue-js/src/button.css | 34 +++++++++++++++ .../template-lib-vue-js/src/index.js | 1 + .../template-lib-vue-js/tests/index.test.js | 16 +++++++ .../template-lib-vue-js/tests/rstest.setup.js | 4 ++ .../template-lib-vue-ts/AGENTS.md | 14 +++++++ .../template-lib-vue-ts/README.md | 40 ++++++++++++++++++ .../template-lib-vue-ts/package.json | 42 +++++++++++++++++++ .../template-lib-vue-ts/rstack.config.ts | 29 +++++++++++++ .../template-lib-vue-ts/src/Button.vue | 33 +++++++++++++++ .../template-lib-vue-ts/src/button.css | 34 +++++++++++++++ .../template-lib-vue-ts/src/index.ts | 1 + .../template-lib-vue-ts/tests/index.test.ts | 16 +++++++ .../template-lib-vue-ts/tests/rstest.setup.ts | 4 ++ .../template-lib-vue-ts/tests/tsconfig.json | 8 ++++ .../template-lib-vue-ts/tsconfig.json | 27 ++++++++++++ packages/create-rstack/tests/create.test.ts | 12 ++++++ 23 files changed, 482 insertions(+) create mode 100644 packages/create-rstack/template-lib-vue-js/AGENTS.md create mode 100644 packages/create-rstack/template-lib-vue-js/README.md create mode 100644 packages/create-rstack/template-lib-vue-js/package.json create mode 100644 packages/create-rstack/template-lib-vue-js/rstack.config.js create mode 100644 packages/create-rstack/template-lib-vue-js/src/Button.vue create mode 100644 packages/create-rstack/template-lib-vue-js/src/button.css create mode 100644 packages/create-rstack/template-lib-vue-js/src/index.js create mode 100644 packages/create-rstack/template-lib-vue-js/tests/index.test.js create mode 100644 packages/create-rstack/template-lib-vue-js/tests/rstest.setup.js create mode 100644 packages/create-rstack/template-lib-vue-ts/AGENTS.md create mode 100644 packages/create-rstack/template-lib-vue-ts/README.md create mode 100644 packages/create-rstack/template-lib-vue-ts/package.json create mode 100644 packages/create-rstack/template-lib-vue-ts/rstack.config.ts create mode 100644 packages/create-rstack/template-lib-vue-ts/src/Button.vue create mode 100644 packages/create-rstack/template-lib-vue-ts/src/button.css create mode 100644 packages/create-rstack/template-lib-vue-ts/src/index.ts create mode 100644 packages/create-rstack/template-lib-vue-ts/tests/index.test.ts create mode 100644 packages/create-rstack/template-lib-vue-ts/tests/rstest.setup.ts create mode 100644 packages/create-rstack/template-lib-vue-ts/tests/tsconfig.json create mode 100644 packages/create-rstack/template-lib-vue-ts/tsconfig.json diff --git a/packages/create-rstack/README.md b/packages/create-rstack/README.md index c0b7c4f0..bdf20f28 100644 --- a/packages/create-rstack/README.md +++ b/packages/create-rstack/README.md @@ -31,6 +31,8 @@ npx create-rstack -d my-project -t app-vanilla-ts - `lib-node-ts` - TypeScript Node.js library - `lib-react-js` - JavaScript React library - `lib-react-ts` - TypeScript React library +- `lib-vue-js` - JavaScript Vue library +- `lib-vue-ts` - TypeScript Vue library ## Documentation diff --git a/packages/create-rstack/src/index.ts b/packages/create-rstack/src/index.ts index e895cecd..360d67a5 100644 --- a/packages/create-rstack/src/index.ts +++ b/packages/create-rstack/src/index.ts @@ -50,6 +50,7 @@ const getTemplateName = async ({ template }: Argv): Promise => { : [ { value: 'node', label: 'Node.js' }, { value: 'react', label: 'React' }, + { value: 'vue', label: 'Vue' }, ], }), ); @@ -81,6 +82,8 @@ await create({ 'lib-node-ts', 'lib-react-js', 'lib-react-ts', + 'lib-vue-js', + 'lib-vue-ts', ], builtinTools: [], getTemplateName, diff --git a/packages/create-rstack/template-lib-vue-js/AGENTS.md b/packages/create-rstack/template-lib-vue-js/AGENTS.md new file mode 100644 index 00000000..234cc720 --- /dev/null +++ b/packages/create-rstack/template-lib-vue-js/AGENTS.md @@ -0,0 +1,14 @@ +# AGENTS.md + +## Commands + +- `{{ packageManager }} run build` - Build the library for production +- `{{ packageManager }} run dev` - Rebuild the library when source files change +- `{{ packageManager }} run test` - Run tests +- `{{ packageManager }} run test:watch` - Run tests in watch mode + +## Docs + +- Rslib: https://rslib.rs/llms.txt +- Rspack: https://rspack.rs/llms.txt +- Rstest: https://rstest.rs/llms.txt diff --git a/packages/create-rstack/template-lib-vue-js/README.md b/packages/create-rstack/template-lib-vue-js/README.md new file mode 100644 index 00000000..ab4b6927 --- /dev/null +++ b/packages/create-rstack/template-lib-vue-js/README.md @@ -0,0 +1,40 @@ +# Rstack library + +## Setup + +Install the dependencies: + +```bash +{{ packageManager }} install +``` + +## Get started + +Build the library: + +```bash +{{ packageManager }} run build +``` + +Build the library in watch mode: + +```bash +{{ packageManager }} run dev +``` + +Run tests: + +```bash +{{ packageManager }} run test +``` + +Run tests in watch mode: + +```bash +{{ packageManager }} run test:watch +``` + +## Learn more + +- [Rstack documentation](https://rstack.rs) +- [Rslib documentation](https://rslib.rs) diff --git a/packages/create-rstack/template-lib-vue-js/package.json b/packages/create-rstack/template-lib-vue-js/package.json new file mode 100644 index 00000000..3edaf57e --- /dev/null +++ b/packages/create-rstack/template-lib-vue-js/package.json @@ -0,0 +1,37 @@ +{ + "name": "rstack-lib-vue-js", + "version": "0.0.0", + "type": "module", + "exports": { + ".": { + "default": "./dist/index.js" + } + }, + "files": [ + "dist", + "README.md" + ], + "scripts": { + "build": "rs lib", + "dev": "rs lib --watch", + "format": "rs fmt", + "lint": "rs lint", + "test": "rs test", + "test:watch": "rs test --watch" + }, + "devDependencies": { + "@rsbuild/plugin-vue": "^2.0.1", + "@testing-library/jest-dom": "^7.0.0", + "@testing-library/vue": "^8.1.0", + "@vue/test-utils": "^2.4.11", + "happy-dom": "^20.11.1", + "rstack": "^0.3.5", + "vue": "^3.5.40" + }, + "peerDependencies": { + "vue": ">=3.2.0" + }, + "publishConfig": { + "access": "public" + } +} diff --git a/packages/create-rstack/template-lib-vue-js/rstack.config.js b/packages/create-rstack/template-lib-vue-js/rstack.config.js new file mode 100644 index 00000000..555838c9 --- /dev/null +++ b/packages/create-rstack/template-lib-vue-js/rstack.config.js @@ -0,0 +1,30 @@ +// @ts-check +// Rstack configuration guide: https://rstack.rs/config +import { define } from 'rstack'; + +define.lib(async () => { + const { pluginVue } = await import('@rsbuild/plugin-vue'); + + return { + bundle: false, + source: { + entry: { + index: ['./src/**'], + }, + }, + output: { + target: 'web', + }, + plugins: [pluginVue()], + }; +}); + +define.test({ + setupFiles: ['./tests/rstest.setup.js'], +}); + +define.lint(async () => { + const { js } = await import('rstack/lint'); + + return [js.configs.recommended]; +}); diff --git a/packages/create-rstack/template-lib-vue-js/src/Button.vue b/packages/create-rstack/template-lib-vue-js/src/Button.vue new file mode 100644 index 00000000..1df2ae6c --- /dev/null +++ b/packages/create-rstack/template-lib-vue-js/src/Button.vue @@ -0,0 +1,41 @@ + + + diff --git a/packages/create-rstack/template-lib-vue-js/src/button.css b/packages/create-rstack/template-lib-vue-js/src/button.css new file mode 100644 index 00000000..257ef46f --- /dev/null +++ b/packages/create-rstack/template-lib-vue-js/src/button.css @@ -0,0 +1,34 @@ +.demo-button { + font-weight: 700; + border: 0; + border-radius: 3em; + cursor: pointer; + display: inline-block; + line-height: 1; +} + +.demo-button--primary { + color: white; + background-color: #1ea7fd; +} + +.demo-button--secondary { + color: #333; + background-color: transparent; + box-shadow: rgba(0, 0, 0, 0.15) 0 0 0 1px inset; +} + +.demo-button--small { + font-size: 12px; + padding: 10px 16px; +} + +.demo-button--medium { + font-size: 14px; + padding: 11px 20px; +} + +.demo-button--large { + font-size: 16px; + padding: 12px 24px; +} diff --git a/packages/create-rstack/template-lib-vue-js/src/index.js b/packages/create-rstack/template-lib-vue-js/src/index.js new file mode 100644 index 00000000..652e7950 --- /dev/null +++ b/packages/create-rstack/template-lib-vue-js/src/index.js @@ -0,0 +1 @@ +export { default as Button } from './Button.vue'; diff --git a/packages/create-rstack/template-lib-vue-js/tests/index.test.js b/packages/create-rstack/template-lib-vue-js/tests/index.test.js new file mode 100644 index 00000000..bdb34a0e --- /dev/null +++ b/packages/create-rstack/template-lib-vue-js/tests/index.test.js @@ -0,0 +1,16 @@ +import { expect, test } from 'rstack/test'; +import { render, screen } from '@testing-library/vue'; +import Button from '../src/Button.vue'; + +test('The button should have correct background color', async () => { + render(Button, { + props: { + backgroundColor: '#ccc', + label: 'Demo Button', + }, + }); + const button = screen.getByText('Demo Button'); + expect(button).toHaveStyle({ + backgroundColor: '#ccc', + }); +}); diff --git a/packages/create-rstack/template-lib-vue-js/tests/rstest.setup.js b/packages/create-rstack/template-lib-vue-js/tests/rstest.setup.js new file mode 100644 index 00000000..93951b15 --- /dev/null +++ b/packages/create-rstack/template-lib-vue-js/tests/rstest.setup.js @@ -0,0 +1,4 @@ +import { expect } from 'rstack/test'; +import * as jestDomMatchers from '@testing-library/jest-dom/matchers'; + +expect.extend(jestDomMatchers); diff --git a/packages/create-rstack/template-lib-vue-ts/AGENTS.md b/packages/create-rstack/template-lib-vue-ts/AGENTS.md new file mode 100644 index 00000000..234cc720 --- /dev/null +++ b/packages/create-rstack/template-lib-vue-ts/AGENTS.md @@ -0,0 +1,14 @@ +# AGENTS.md + +## Commands + +- `{{ packageManager }} run build` - Build the library for production +- `{{ packageManager }} run dev` - Rebuild the library when source files change +- `{{ packageManager }} run test` - Run tests +- `{{ packageManager }} run test:watch` - Run tests in watch mode + +## Docs + +- Rslib: https://rslib.rs/llms.txt +- Rspack: https://rspack.rs/llms.txt +- Rstest: https://rstest.rs/llms.txt diff --git a/packages/create-rstack/template-lib-vue-ts/README.md b/packages/create-rstack/template-lib-vue-ts/README.md new file mode 100644 index 00000000..ab4b6927 --- /dev/null +++ b/packages/create-rstack/template-lib-vue-ts/README.md @@ -0,0 +1,40 @@ +# Rstack library + +## Setup + +Install the dependencies: + +```bash +{{ packageManager }} install +``` + +## Get started + +Build the library: + +```bash +{{ packageManager }} run build +``` + +Build the library in watch mode: + +```bash +{{ packageManager }} run dev +``` + +Run tests: + +```bash +{{ packageManager }} run test +``` + +Run tests in watch mode: + +```bash +{{ packageManager }} run test:watch +``` + +## Learn more + +- [Rstack documentation](https://rstack.rs) +- [Rslib documentation](https://rslib.rs) diff --git a/packages/create-rstack/template-lib-vue-ts/package.json b/packages/create-rstack/template-lib-vue-ts/package.json new file mode 100644 index 00000000..9d269690 --- /dev/null +++ b/packages/create-rstack/template-lib-vue-ts/package.json @@ -0,0 +1,42 @@ +{ + "name": "rstack-lib-vue-ts", + "version": "0.0.0", + "type": "module", + "exports": { + ".": { + "types": "./dist/index.d.ts", + "default": "./dist/index.js" + } + }, + "types": "./dist/index.d.ts", + "files": [ + "dist", + "README.md" + ], + "scripts": { + "build": "rs lib && vue-tsc", + "dev": "rs lib --watch", + "format": "rs fmt", + "lint": "rs lint", + "test": "rs test", + "test:watch": "rs test --watch" + }, + "devDependencies": { + "@rsbuild/plugin-vue": "^2.0.1", + "@testing-library/jest-dom": "^7.0.0", + "@testing-library/vue": "^8.1.0", + "@types/node": "^24.13.3", + "@vue/test-utils": "^2.4.11", + "happy-dom": "^20.11.1", + "rstack": "^0.3.5", + "typescript": "^6.0.3", + "vue": "^3.5.40", + "vue-tsc": "^3.3.9" + }, + "peerDependencies": { + "vue": ">=3.2.0" + }, + "publishConfig": { + "access": "public" + } +} diff --git a/packages/create-rstack/template-lib-vue-ts/rstack.config.ts b/packages/create-rstack/template-lib-vue-ts/rstack.config.ts new file mode 100644 index 00000000..c5d70cf7 --- /dev/null +++ b/packages/create-rstack/template-lib-vue-ts/rstack.config.ts @@ -0,0 +1,29 @@ +// Rstack configuration guide: https://rstack.rs/config +import { define } from 'rstack'; + +define.lib(async () => { + const { pluginVue } = await import('@rsbuild/plugin-vue'); + + return { + bundle: false, + source: { + entry: { + index: ['./src/**'], + }, + }, + output: { + target: 'web', + }, + plugins: [pluginVue()], + }; +}); + +define.test({ + setupFiles: ['./tests/rstest.setup.ts'], +}); + +define.lint(async () => { + const { js, ts } = await import('rstack/lint'); + + return [js.configs.recommended, ts.configs.recommended]; +}); diff --git a/packages/create-rstack/template-lib-vue-ts/src/Button.vue b/packages/create-rstack/template-lib-vue-ts/src/Button.vue new file mode 100644 index 00000000..1d4d9cb8 --- /dev/null +++ b/packages/create-rstack/template-lib-vue-ts/src/Button.vue @@ -0,0 +1,33 @@ + + + diff --git a/packages/create-rstack/template-lib-vue-ts/src/button.css b/packages/create-rstack/template-lib-vue-ts/src/button.css new file mode 100644 index 00000000..257ef46f --- /dev/null +++ b/packages/create-rstack/template-lib-vue-ts/src/button.css @@ -0,0 +1,34 @@ +.demo-button { + font-weight: 700; + border: 0; + border-radius: 3em; + cursor: pointer; + display: inline-block; + line-height: 1; +} + +.demo-button--primary { + color: white; + background-color: #1ea7fd; +} + +.demo-button--secondary { + color: #333; + background-color: transparent; + box-shadow: rgba(0, 0, 0, 0.15) 0 0 0 1px inset; +} + +.demo-button--small { + font-size: 12px; + padding: 10px 16px; +} + +.demo-button--medium { + font-size: 14px; + padding: 11px 20px; +} + +.demo-button--large { + font-size: 16px; + padding: 12px 24px; +} diff --git a/packages/create-rstack/template-lib-vue-ts/src/index.ts b/packages/create-rstack/template-lib-vue-ts/src/index.ts new file mode 100644 index 00000000..652e7950 --- /dev/null +++ b/packages/create-rstack/template-lib-vue-ts/src/index.ts @@ -0,0 +1 @@ +export { default as Button } from './Button.vue'; diff --git a/packages/create-rstack/template-lib-vue-ts/tests/index.test.ts b/packages/create-rstack/template-lib-vue-ts/tests/index.test.ts new file mode 100644 index 00000000..bdb34a0e --- /dev/null +++ b/packages/create-rstack/template-lib-vue-ts/tests/index.test.ts @@ -0,0 +1,16 @@ +import { expect, test } from 'rstack/test'; +import { render, screen } from '@testing-library/vue'; +import Button from '../src/Button.vue'; + +test('The button should have correct background color', async () => { + render(Button, { + props: { + backgroundColor: '#ccc', + label: 'Demo Button', + }, + }); + const button = screen.getByText('Demo Button'); + expect(button).toHaveStyle({ + backgroundColor: '#ccc', + }); +}); diff --git a/packages/create-rstack/template-lib-vue-ts/tests/rstest.setup.ts b/packages/create-rstack/template-lib-vue-ts/tests/rstest.setup.ts new file mode 100644 index 00000000..93951b15 --- /dev/null +++ b/packages/create-rstack/template-lib-vue-ts/tests/rstest.setup.ts @@ -0,0 +1,4 @@ +import { expect } from 'rstack/test'; +import * as jestDomMatchers from '@testing-library/jest-dom/matchers'; + +expect.extend(jestDomMatchers); diff --git a/packages/create-rstack/template-lib-vue-ts/tests/tsconfig.json b/packages/create-rstack/template-lib-vue-ts/tests/tsconfig.json new file mode 100644 index 00000000..b13d0ac4 --- /dev/null +++ b/packages/create-rstack/template-lib-vue-ts/tests/tsconfig.json @@ -0,0 +1,8 @@ +{ + "extends": "../tsconfig.json", + "compilerOptions": { + "rootDir": "..", + "types": ["@testing-library/jest-dom"] + }, + "include": ["./"] +} diff --git a/packages/create-rstack/template-lib-vue-ts/tsconfig.json b/packages/create-rstack/template-lib-vue-ts/tsconfig.json new file mode 100644 index 00000000..9d608297 --- /dev/null +++ b/packages/create-rstack/template-lib-vue-ts/tsconfig.json @@ -0,0 +1,27 @@ +{ + "compilerOptions": { + "lib": ["DOM", "ES2022"], + "jsx": "preserve", + "target": "ES2022", + "declaration": true, + "emitDeclarationOnly": true, + "outDir": "dist", + "skipLibCheck": true, + "types": ["rstack/types", "node"], + "jsxImportSource": "vue", + "useDefineForClassFields": true, + "rootDir": "src", + + /* modules */ + "moduleDetection": "force", + "moduleResolution": "bundler", + "verbatimModuleSyntax": true, + "resolveJsonModule": true, + "allowImportingTsExtensions": true, + + /* type checking */ + "noUnusedLocals": true, + "noUnusedParameters": true + }, + "include": ["src"] +} diff --git a/packages/create-rstack/tests/create.test.ts b/packages/create-rstack/tests/create.test.ts index 74306421..920301f5 100644 --- a/packages/create-rstack/tests/create.test.ts +++ b/packages/create-rstack/tests/create.test.ts @@ -122,6 +122,18 @@ test.each([ sourceExtension: 'tsx', hasTypeScript: true, }, + { + template: 'lib-vue-js', + configExtension: 'js', + sourceExtension: 'js', + hasTypeScript: false, + }, + { + template: 'lib-vue-ts', + configExtension: 'ts', + sourceExtension: 'ts', + hasTypeScript: true, + }, ])( 'creates the $template template', async ({ template, configExtension, sourceExtension, hasTypeScript }) => { From 3fcf1b735cd123cdf9fd4a8fd44ee2c52a2b8649 Mon Sep 17 00:00:00 2001 From: Jiahan Chen Date: Sat, 8 Aug 2026 17:08:25 +0800 Subject: [PATCH 02/76] feat(create-rstack): add Solid app templates (#249) --- packages/create-rstack/README.md | 2 ++ packages/create-rstack/src/index.ts | 3 +++ .../template-app-solid-js/AGENTS.md | 12 +++++++++ .../template-app-solid-js/package.json | 22 +++++++++++++++ .../template-app-solid-js/rstack.config.js | 27 +++++++++++++++++++ .../template-app-solid-js/src/App.css | 26 ++++++++++++++++++ .../template-app-solid-js/src/App.jsx | 12 +++++++++ .../template-app-solid-js/src/index.jsx | 4 +++ .../template-app-solid-ts/AGENTS.md | 12 +++++++++ .../template-app-solid-ts/package.json | 24 +++++++++++++++++ .../template-app-solid-ts/rstack.config.ts | 26 ++++++++++++++++++ .../template-app-solid-ts/src/App.css | 26 ++++++++++++++++++ .../template-app-solid-ts/src/App.tsx | 12 +++++++++ .../template-app-solid-ts/src/index.tsx | 7 +++++ .../template-app-solid-ts/tsconfig.json | 24 +++++++++++++++++ packages/create-rstack/tests/create.test.ts | 12 +++++++++ 16 files changed, 251 insertions(+) create mode 100644 packages/create-rstack/template-app-solid-js/AGENTS.md create mode 100644 packages/create-rstack/template-app-solid-js/package.json create mode 100644 packages/create-rstack/template-app-solid-js/rstack.config.js create mode 100644 packages/create-rstack/template-app-solid-js/src/App.css create mode 100644 packages/create-rstack/template-app-solid-js/src/App.jsx create mode 100644 packages/create-rstack/template-app-solid-js/src/index.jsx create mode 100644 packages/create-rstack/template-app-solid-ts/AGENTS.md create mode 100644 packages/create-rstack/template-app-solid-ts/package.json create mode 100644 packages/create-rstack/template-app-solid-ts/rstack.config.ts create mode 100644 packages/create-rstack/template-app-solid-ts/src/App.css create mode 100644 packages/create-rstack/template-app-solid-ts/src/App.tsx create mode 100644 packages/create-rstack/template-app-solid-ts/src/index.tsx create mode 100644 packages/create-rstack/template-app-solid-ts/tsconfig.json diff --git a/packages/create-rstack/README.md b/packages/create-rstack/README.md index bdf20f28..f9cac468 100644 --- a/packages/create-rstack/README.md +++ b/packages/create-rstack/README.md @@ -27,6 +27,8 @@ npx create-rstack -d my-project -t app-vanilla-ts - `app-react-ts` - TypeScript React application - `app-vue-js` - JavaScript Vue application - `app-vue-ts` - TypeScript Vue application +- `app-solid-js` - JavaScript Solid application +- `app-solid-ts` - TypeScript Solid application - `lib-node-js` - JavaScript Node.js library - `lib-node-ts` - TypeScript Node.js library - `lib-react-js` - JavaScript React library diff --git a/packages/create-rstack/src/index.ts b/packages/create-rstack/src/index.ts index 360d67a5..49e8765b 100644 --- a/packages/create-rstack/src/index.ts +++ b/packages/create-rstack/src/index.ts @@ -46,6 +46,7 @@ const getTemplateName = async ({ template }: Argv): Promise => { { value: 'vanilla', label: 'Vanilla' }, { value: 'react', label: 'React' }, { value: 'vue', label: 'Vue' }, + { value: 'solid', label: 'Solid' }, ] : [ { value: 'node', label: 'Node.js' }, @@ -78,6 +79,8 @@ await create({ 'app-react-ts', 'app-vue-js', 'app-vue-ts', + 'app-solid-js', + 'app-solid-ts', 'lib-node-js', 'lib-node-ts', 'lib-react-js', diff --git a/packages/create-rstack/template-app-solid-js/AGENTS.md b/packages/create-rstack/template-app-solid-js/AGENTS.md new file mode 100644 index 00000000..fb378511 --- /dev/null +++ b/packages/create-rstack/template-app-solid-js/AGENTS.md @@ -0,0 +1,12 @@ +# AGENTS.md + +## Commands + +- `{{ packageManager }} run dev` - Start the development server +- `{{ packageManager }} run build` - Build the app for production +- `{{ packageManager }} run preview` - Preview the production build locally + +## Docs + +- Rsbuild: https://rsbuild.rs/llms.txt +- Rspack: https://rspack.rs/llms.txt diff --git a/packages/create-rstack/template-app-solid-js/package.json b/packages/create-rstack/template-app-solid-js/package.json new file mode 100644 index 00000000..887de41a --- /dev/null +++ b/packages/create-rstack/template-app-solid-js/package.json @@ -0,0 +1,22 @@ +{ + "name": "rstack-app-solid-js", + "version": "1.0.0", + "private": true, + "type": "module", + "scripts": { + "build": "rs build", + "dev": "rs dev", + "format": "rs fmt", + "lint": "rs lint", + "preview": "rs preview", + "test": "rs test" + }, + "dependencies": { + "solid-js": "^1.9.14" + }, + "devDependencies": { + "@rsbuild/plugin-babel": "^2.0.1", + "@rsbuild/plugin-solid": "^1.2.2", + "rstack": "^0.3.5" + } +} diff --git a/packages/create-rstack/template-app-solid-js/rstack.config.js b/packages/create-rstack/template-app-solid-js/rstack.config.js new file mode 100644 index 00000000..aab9ecfd --- /dev/null +++ b/packages/create-rstack/template-app-solid-js/rstack.config.js @@ -0,0 +1,27 @@ +// @ts-check +// Rstack configuration guide: https://rstack.rs/config +import { define } from 'rstack'; + +define.app(async () => { + const { pluginBabel } = await import('@rsbuild/plugin-babel'); + const { pluginSolid } = await import('@rsbuild/plugin-solid'); + + return { + plugins: [ + pluginBabel({ + include: /\.(?:jsx|tsx)$/, + }), + pluginSolid(), + ], + }; +}); + +define.test({ + // Configure Rstest +}); + +define.lint(async () => { + const { js } = await import('rstack/lint'); + + return [js.configs.recommended]; +}); diff --git a/packages/create-rstack/template-app-solid-js/src/App.css b/packages/create-rstack/template-app-solid-js/src/App.css new file mode 100644 index 00000000..164c0a6a --- /dev/null +++ b/packages/create-rstack/template-app-solid-js/src/App.css @@ -0,0 +1,26 @@ +body { + margin: 0; + color: #fff; + font-family: Inter, Avenir, Helvetica, Arial, sans-serif; + background-image: linear-gradient(to bottom, #020917, #101725); +} + +.content { + display: flex; + min-height: 100vh; + line-height: 1.1; + text-align: center; + flex-direction: column; + justify-content: center; +} + +.content h1 { + font-size: 3.6rem; + font-weight: 700; +} + +.content p { + font-size: 1.2rem; + font-weight: 400; + opacity: 0.5; +} diff --git a/packages/create-rstack/template-app-solid-js/src/App.jsx b/packages/create-rstack/template-app-solid-js/src/App.jsx new file mode 100644 index 00000000..732c63f9 --- /dev/null +++ b/packages/create-rstack/template-app-solid-js/src/App.jsx @@ -0,0 +1,12 @@ +import './App.css'; + +const App = () => { + return ( +
+

Rstack with Solid

+

Start building amazing things with Rstack.

+
+ ); +}; + +export default App; diff --git a/packages/create-rstack/template-app-solid-js/src/index.jsx b/packages/create-rstack/template-app-solid-js/src/index.jsx new file mode 100644 index 00000000..c6c556ad --- /dev/null +++ b/packages/create-rstack/template-app-solid-js/src/index.jsx @@ -0,0 +1,4 @@ +import { render } from 'solid-js/web'; +import App from './App'; + +render(() => , document.getElementById('root')); diff --git a/packages/create-rstack/template-app-solid-ts/AGENTS.md b/packages/create-rstack/template-app-solid-ts/AGENTS.md new file mode 100644 index 00000000..fb378511 --- /dev/null +++ b/packages/create-rstack/template-app-solid-ts/AGENTS.md @@ -0,0 +1,12 @@ +# AGENTS.md + +## Commands + +- `{{ packageManager }} run dev` - Start the development server +- `{{ packageManager }} run build` - Build the app for production +- `{{ packageManager }} run preview` - Preview the production build locally + +## Docs + +- Rsbuild: https://rsbuild.rs/llms.txt +- Rspack: https://rspack.rs/llms.txt diff --git a/packages/create-rstack/template-app-solid-ts/package.json b/packages/create-rstack/template-app-solid-ts/package.json new file mode 100644 index 00000000..3cdc10c5 --- /dev/null +++ b/packages/create-rstack/template-app-solid-ts/package.json @@ -0,0 +1,24 @@ +{ + "name": "rstack-app-solid-ts", + "version": "1.0.0", + "private": true, + "type": "module", + "scripts": { + "build": "rs build", + "dev": "rs dev", + "format": "rs fmt", + "lint": "rs lint", + "preview": "rs preview", + "test": "rs test" + }, + "dependencies": { + "solid-js": "^1.9.14" + }, + "devDependencies": { + "@rsbuild/plugin-babel": "^2.0.1", + "@rsbuild/plugin-solid": "^1.2.2", + "@types/node": "^24.13.3", + "rstack": "^0.3.5", + "typescript": "^7.0.2" + } +} diff --git a/packages/create-rstack/template-app-solid-ts/rstack.config.ts b/packages/create-rstack/template-app-solid-ts/rstack.config.ts new file mode 100644 index 00000000..05629b14 --- /dev/null +++ b/packages/create-rstack/template-app-solid-ts/rstack.config.ts @@ -0,0 +1,26 @@ +// Rstack configuration guide: https://rstack.rs/config +import { define } from 'rstack'; + +define.app(async () => { + const { pluginBabel } = await import('@rsbuild/plugin-babel'); + const { pluginSolid } = await import('@rsbuild/plugin-solid'); + + return { + plugins: [ + pluginBabel({ + include: /\.(?:jsx|tsx)$/, + }), + pluginSolid(), + ], + }; +}); + +define.test({ + // Configure Rstest +}); + +define.lint(async () => { + const { js, ts } = await import('rstack/lint'); + + return [js.configs.recommended, ts.configs.recommended]; +}); diff --git a/packages/create-rstack/template-app-solid-ts/src/App.css b/packages/create-rstack/template-app-solid-ts/src/App.css new file mode 100644 index 00000000..164c0a6a --- /dev/null +++ b/packages/create-rstack/template-app-solid-ts/src/App.css @@ -0,0 +1,26 @@ +body { + margin: 0; + color: #fff; + font-family: Inter, Avenir, Helvetica, Arial, sans-serif; + background-image: linear-gradient(to bottom, #020917, #101725); +} + +.content { + display: flex; + min-height: 100vh; + line-height: 1.1; + text-align: center; + flex-direction: column; + justify-content: center; +} + +.content h1 { + font-size: 3.6rem; + font-weight: 700; +} + +.content p { + font-size: 1.2rem; + font-weight: 400; + opacity: 0.5; +} diff --git a/packages/create-rstack/template-app-solid-ts/src/App.tsx b/packages/create-rstack/template-app-solid-ts/src/App.tsx new file mode 100644 index 00000000..732c63f9 --- /dev/null +++ b/packages/create-rstack/template-app-solid-ts/src/App.tsx @@ -0,0 +1,12 @@ +import './App.css'; + +const App = () => { + return ( +
+

Rstack with Solid

+

Start building amazing things with Rstack.

+
+ ); +}; + +export default App; diff --git a/packages/create-rstack/template-app-solid-ts/src/index.tsx b/packages/create-rstack/template-app-solid-ts/src/index.tsx new file mode 100644 index 00000000..56ad2157 --- /dev/null +++ b/packages/create-rstack/template-app-solid-ts/src/index.tsx @@ -0,0 +1,7 @@ +import { render } from 'solid-js/web'; +import App from './App'; + +const root = document.getElementById('root'); +if (root) { + render(() => , root); +} diff --git a/packages/create-rstack/template-app-solid-ts/tsconfig.json b/packages/create-rstack/template-app-solid-ts/tsconfig.json new file mode 100644 index 00000000..0437f985 --- /dev/null +++ b/packages/create-rstack/template-app-solid-ts/tsconfig.json @@ -0,0 +1,24 @@ +{ + "compilerOptions": { + "lib": ["DOM", "ES2020"], + "jsx": "preserve", + "target": "ES2020", + "noEmit": true, + "skipLibCheck": true, + "types": ["rstack/types", "node"], + "jsxImportSource": "solid-js", + "useDefineForClassFields": true, + + /* modules */ + "moduleDetection": "force", + "moduleResolution": "bundler", + "verbatimModuleSyntax": true, + "resolveJsonModule": true, + "allowImportingTsExtensions": true, + + /* type checking */ + "noUnusedLocals": true, + "noUnusedParameters": true + }, + "include": ["src"] +} diff --git a/packages/create-rstack/tests/create.test.ts b/packages/create-rstack/tests/create.test.ts index 920301f5..34352fc5 100644 --- a/packages/create-rstack/tests/create.test.ts +++ b/packages/create-rstack/tests/create.test.ts @@ -69,6 +69,18 @@ test.each([ sourceExtension: 'ts', hasTypeScript: true, }, + { + template: 'app-solid-js', + configExtension: 'js', + sourceExtension: 'jsx', + hasTypeScript: false, + }, + { + template: 'app-solid-ts', + configExtension: 'ts', + sourceExtension: 'tsx', + hasTypeScript: true, + }, ])( 'creates the $template template', async ({ template, configExtension, sourceExtension, hasTypeScript }) => { From d116f5f7723cf266317b917fca68a88bfe2a403f Mon Sep 17 00:00:00 2001 From: Jiahan Chen Date: Sat, 8 Aug 2026 17:32:48 +0800 Subject: [PATCH 03/76] feat(create-rstack): add Solid library templates (#250) --- packages/create-rstack/README.md | 2 + packages/create-rstack/src/index.ts | 3 + .../template-lib-solid-js/AGENTS.md | 14 ++++ .../template-lib-solid-js/README.md | 40 +++++++++ .../template-lib-solid-js/package.json | 39 +++++++++ .../template-lib-solid-js/rstack.config.js | 82 +++++++++++++++++++ .../template-lib-solid-js/src/Button.jsx | 17 ++++ .../template-lib-solid-js/src/button.css | 34 ++++++++ .../template-lib-solid-js/src/index.jsx | 1 + .../tests/index.test.jsx | 11 +++ .../tests/rstest.setup.js | 4 + .../template-lib-solid-ts/AGENTS.md | 14 ++++ .../template-lib-solid-ts/README.md | 40 +++++++++ .../template-lib-solid-ts/package.json | 43 ++++++++++ .../template-lib-solid-ts/rstack.config.ts | 82 +++++++++++++++++++ .../template-lib-solid-ts/src/Button.tsx | 42 ++++++++++ .../template-lib-solid-ts/src/button.css | 34 ++++++++ .../template-lib-solid-ts/src/index.tsx | 2 + .../tests/index.test.tsx | 11 +++ .../tests/rstest.setup.ts | 4 + .../template-lib-solid-ts/tests/tsconfig.json | 8 ++ .../template-lib-solid-ts/tsconfig.json | 25 ++++++ packages/create-rstack/tests/create.test.ts | 12 +++ scripts/dictionary.txt | 1 + 24 files changed, 565 insertions(+) create mode 100644 packages/create-rstack/template-lib-solid-js/AGENTS.md create mode 100644 packages/create-rstack/template-lib-solid-js/README.md create mode 100644 packages/create-rstack/template-lib-solid-js/package.json create mode 100644 packages/create-rstack/template-lib-solid-js/rstack.config.js create mode 100644 packages/create-rstack/template-lib-solid-js/src/Button.jsx create mode 100644 packages/create-rstack/template-lib-solid-js/src/button.css create mode 100644 packages/create-rstack/template-lib-solid-js/src/index.jsx create mode 100644 packages/create-rstack/template-lib-solid-js/tests/index.test.jsx create mode 100644 packages/create-rstack/template-lib-solid-js/tests/rstest.setup.js create mode 100644 packages/create-rstack/template-lib-solid-ts/AGENTS.md create mode 100644 packages/create-rstack/template-lib-solid-ts/README.md create mode 100644 packages/create-rstack/template-lib-solid-ts/package.json create mode 100644 packages/create-rstack/template-lib-solid-ts/rstack.config.ts create mode 100644 packages/create-rstack/template-lib-solid-ts/src/Button.tsx create mode 100644 packages/create-rstack/template-lib-solid-ts/src/button.css create mode 100644 packages/create-rstack/template-lib-solid-ts/src/index.tsx create mode 100644 packages/create-rstack/template-lib-solid-ts/tests/index.test.tsx create mode 100644 packages/create-rstack/template-lib-solid-ts/tests/rstest.setup.ts create mode 100644 packages/create-rstack/template-lib-solid-ts/tests/tsconfig.json create mode 100644 packages/create-rstack/template-lib-solid-ts/tsconfig.json diff --git a/packages/create-rstack/README.md b/packages/create-rstack/README.md index f9cac468..11e33dde 100644 --- a/packages/create-rstack/README.md +++ b/packages/create-rstack/README.md @@ -35,6 +35,8 @@ npx create-rstack -d my-project -t app-vanilla-ts - `lib-react-ts` - TypeScript React library - `lib-vue-js` - JavaScript Vue library - `lib-vue-ts` - TypeScript Vue library +- `lib-solid-js` - JavaScript Solid library +- `lib-solid-ts` - TypeScript Solid library ## Documentation diff --git a/packages/create-rstack/src/index.ts b/packages/create-rstack/src/index.ts index 49e8765b..2aa269a5 100644 --- a/packages/create-rstack/src/index.ts +++ b/packages/create-rstack/src/index.ts @@ -52,6 +52,7 @@ const getTemplateName = async ({ template }: Argv): Promise => { { value: 'node', label: 'Node.js' }, { value: 'react', label: 'React' }, { value: 'vue', label: 'Vue' }, + { value: 'solid', label: 'Solid' }, ], }), ); @@ -87,6 +88,8 @@ await create({ 'lib-react-ts', 'lib-vue-js', 'lib-vue-ts', + 'lib-solid-js', + 'lib-solid-ts', ], builtinTools: [], getTemplateName, diff --git a/packages/create-rstack/template-lib-solid-js/AGENTS.md b/packages/create-rstack/template-lib-solid-js/AGENTS.md new file mode 100644 index 00000000..234cc720 --- /dev/null +++ b/packages/create-rstack/template-lib-solid-js/AGENTS.md @@ -0,0 +1,14 @@ +# AGENTS.md + +## Commands + +- `{{ packageManager }} run build` - Build the library for production +- `{{ packageManager }} run dev` - Rebuild the library when source files change +- `{{ packageManager }} run test` - Run tests +- `{{ packageManager }} run test:watch` - Run tests in watch mode + +## Docs + +- Rslib: https://rslib.rs/llms.txt +- Rspack: https://rspack.rs/llms.txt +- Rstest: https://rstest.rs/llms.txt diff --git a/packages/create-rstack/template-lib-solid-js/README.md b/packages/create-rstack/template-lib-solid-js/README.md new file mode 100644 index 00000000..ab4b6927 --- /dev/null +++ b/packages/create-rstack/template-lib-solid-js/README.md @@ -0,0 +1,40 @@ +# Rstack library + +## Setup + +Install the dependencies: + +```bash +{{ packageManager }} install +``` + +## Get started + +Build the library: + +```bash +{{ packageManager }} run build +``` + +Build the library in watch mode: + +```bash +{{ packageManager }} run dev +``` + +Run tests: + +```bash +{{ packageManager }} run test +``` + +Run tests in watch mode: + +```bash +{{ packageManager }} run test:watch +``` + +## Learn more + +- [Rstack documentation](https://rstack.rs) +- [Rslib documentation](https://rslib.rs) diff --git a/packages/create-rstack/template-lib-solid-js/package.json b/packages/create-rstack/template-lib-solid-js/package.json new file mode 100644 index 00000000..85721ae5 --- /dev/null +++ b/packages/create-rstack/template-lib-solid-js/package.json @@ -0,0 +1,39 @@ +{ + "name": "rstack-lib-solid-js", + "version": "0.0.0", + "type": "module", + "exports": { + ".": { + "solid": "./dist/index.jsx", + "default": "./dist/index.js" + } + }, + "files": [ + "dist", + "README.md" + ], + "scripts": { + "build": "rs lib", + "dev": "rs lib --watch", + "format": "rs fmt", + "lint": "rs lint", + "test": "rs test", + "test:watch": "rs test --watch" + }, + "devDependencies": { + "@rsbuild/plugin-babel": "^2.0.1", + "@rsbuild/plugin-solid": "^1.2.2", + "@solidjs/testing-library": "^0.8.10", + "@testing-library/dom": "^10.4.1", + "@testing-library/jest-dom": "^7.0.0", + "happy-dom": "^20.11.1", + "rstack": "^0.3.5", + "solid-js": "^1.9.14" + }, + "peerDependencies": { + "solid-js": ">=1.8.0" + }, + "publishConfig": { + "access": "public" + } +} diff --git a/packages/create-rstack/template-lib-solid-js/rstack.config.js b/packages/create-rstack/template-lib-solid-js/rstack.config.js new file mode 100644 index 00000000..b30ed373 --- /dev/null +++ b/packages/create-rstack/template-lib-solid-js/rstack.config.js @@ -0,0 +1,82 @@ +// @ts-check +// Rstack configuration guide: https://rstack.rs/config +import { define } from 'rstack'; + +define.lib(async () => { + const { pluginBabel } = await import('@rsbuild/plugin-babel'); + const { pluginSolid } = await import('@rsbuild/plugin-solid'); + + return { + lib: [ + { + id: 'compiled', + bundle: false, + plugins: [ + pluginBabel({ + include: /\.(?:jsx|tsx)$/, + }), + pluginSolid(), + ], + }, + { + id: 'source', + bundle: false, + output: { + filename: { + js: '[name].jsx', + }, + }, + tools: { + swc: { + detectSyntax: 'auto', + jsc: { + transform: { + react: { + runtime: 'preserve', + }, + }, + }, + }, + rspack: { + module: { + parser: { + javascript: { + jsx: true, + }, + }, + }, + }, + }, + }, + ], + source: { + entry: { + index: ['./src/**'], + }, + }, + output: { + target: 'web', + }, + }; +}); + +define.test(async () => { + const { pluginBabel } = await import('@rsbuild/plugin-babel'); + const { pluginSolid } = await import('@rsbuild/plugin-solid'); + + return { + setupFiles: ['./tests/rstest.setup.js'], + plugins: [ + pluginBabel({ + include: /\.(?:jsx|tsx)$/, + }), + pluginSolid(), + ], + }; +}); + +define.lint(async () => { + const { js } = await import('rstack/lint'); + + return [js.configs.recommended]; +}); diff --git a/packages/create-rstack/template-lib-solid-js/src/Button.jsx b/packages/create-rstack/template-lib-solid-js/src/Button.jsx new file mode 100644 index 00000000..ffbf79b1 --- /dev/null +++ b/packages/create-rstack/template-lib-solid-js/src/Button.jsx @@ -0,0 +1,17 @@ +import './button.css'; + +export function Button(props) { + const mode = () => (props.primary ? 'demo-button--primary' : 'demo-button--secondary'); + const size = () => props.size ?? 'medium'; + + return ( + + ); +} diff --git a/packages/create-rstack/template-lib-solid-js/src/button.css b/packages/create-rstack/template-lib-solid-js/src/button.css new file mode 100644 index 00000000..257ef46f --- /dev/null +++ b/packages/create-rstack/template-lib-solid-js/src/button.css @@ -0,0 +1,34 @@ +.demo-button { + font-weight: 700; + border: 0; + border-radius: 3em; + cursor: pointer; + display: inline-block; + line-height: 1; +} + +.demo-button--primary { + color: white; + background-color: #1ea7fd; +} + +.demo-button--secondary { + color: #333; + background-color: transparent; + box-shadow: rgba(0, 0, 0, 0.15) 0 0 0 1px inset; +} + +.demo-button--small { + font-size: 12px; + padding: 10px 16px; +} + +.demo-button--medium { + font-size: 14px; + padding: 11px 20px; +} + +.demo-button--large { + font-size: 16px; + padding: 12px 24px; +} diff --git a/packages/create-rstack/template-lib-solid-js/src/index.jsx b/packages/create-rstack/template-lib-solid-js/src/index.jsx new file mode 100644 index 00000000..fe9c53c5 --- /dev/null +++ b/packages/create-rstack/template-lib-solid-js/src/index.jsx @@ -0,0 +1 @@ +export { Button } from './Button'; diff --git a/packages/create-rstack/template-lib-solid-js/tests/index.test.jsx b/packages/create-rstack/template-lib-solid-js/tests/index.test.jsx new file mode 100644 index 00000000..b2a49c13 --- /dev/null +++ b/packages/create-rstack/template-lib-solid-js/tests/index.test.jsx @@ -0,0 +1,11 @@ +import { render, screen } from '@solidjs/testing-library'; +import { expect, test } from 'rstack/test'; +import { Button } from '../src/Button'; + +test('The button should have correct background color', async () => { + render(() => + ); +} diff --git a/packages/create-rstack/template-lib-solid-ts/src/button.css b/packages/create-rstack/template-lib-solid-ts/src/button.css new file mode 100644 index 00000000..257ef46f --- /dev/null +++ b/packages/create-rstack/template-lib-solid-ts/src/button.css @@ -0,0 +1,34 @@ +.demo-button { + font-weight: 700; + border: 0; + border-radius: 3em; + cursor: pointer; + display: inline-block; + line-height: 1; +} + +.demo-button--primary { + color: white; + background-color: #1ea7fd; +} + +.demo-button--secondary { + color: #333; + background-color: transparent; + box-shadow: rgba(0, 0, 0, 0.15) 0 0 0 1px inset; +} + +.demo-button--small { + font-size: 12px; + padding: 10px 16px; +} + +.demo-button--medium { + font-size: 14px; + padding: 11px 20px; +} + +.demo-button--large { + font-size: 16px; + padding: 12px 24px; +} diff --git a/packages/create-rstack/template-lib-solid-ts/src/index.tsx b/packages/create-rstack/template-lib-solid-ts/src/index.tsx new file mode 100644 index 00000000..fa3c8a51 --- /dev/null +++ b/packages/create-rstack/template-lib-solid-ts/src/index.tsx @@ -0,0 +1,2 @@ +export { Button } from './Button'; +export type { ButtonProps } from './Button'; diff --git a/packages/create-rstack/template-lib-solid-ts/tests/index.test.tsx b/packages/create-rstack/template-lib-solid-ts/tests/index.test.tsx new file mode 100644 index 00000000..b2a49c13 --- /dev/null +++ b/packages/create-rstack/template-lib-solid-ts/tests/index.test.tsx @@ -0,0 +1,11 @@ +import { render, screen } from '@solidjs/testing-library'; +import { expect, test } from 'rstack/test'; +import { Button } from '../src/Button'; + +test('The button should have correct background color', async () => { + render(() => diff --git a/packages/create-rstack/template-lib-svelte-js/src/button.css b/packages/create-rstack/template-lib-svelte-js/src/button.css new file mode 100644 index 00000000..257ef46f --- /dev/null +++ b/packages/create-rstack/template-lib-svelte-js/src/button.css @@ -0,0 +1,34 @@ +.demo-button { + font-weight: 700; + border: 0; + border-radius: 3em; + cursor: pointer; + display: inline-block; + line-height: 1; +} + +.demo-button--primary { + color: white; + background-color: #1ea7fd; +} + +.demo-button--secondary { + color: #333; + background-color: transparent; + box-shadow: rgba(0, 0, 0, 0.15) 0 0 0 1px inset; +} + +.demo-button--small { + font-size: 12px; + padding: 10px 16px; +} + +.demo-button--medium { + font-size: 14px; + padding: 11px 20px; +} + +.demo-button--large { + font-size: 16px; + padding: 12px 24px; +} diff --git a/packages/create-rstack/template-lib-svelte-js/src/index.js b/packages/create-rstack/template-lib-svelte-js/src/index.js new file mode 100644 index 00000000..ae34e39c --- /dev/null +++ b/packages/create-rstack/template-lib-svelte-js/src/index.js @@ -0,0 +1 @@ +export { default as Button } from './Button.svelte'; diff --git a/packages/create-rstack/template-lib-svelte-js/tests/index.test.js b/packages/create-rstack/template-lib-svelte-js/tests/index.test.js new file mode 100644 index 00000000..cfcfa131 --- /dev/null +++ b/packages/create-rstack/template-lib-svelte-js/tests/index.test.js @@ -0,0 +1,19 @@ +import { expect, test } from 'rstack/test'; +import { mount, unmount } from 'svelte'; +import Button from '../src/Button.svelte'; + +test('The button should render the default label', () => { + const target = document.createElement('div'); + document.body.append(target); + const component = mount(Button, { target }); + const button = target.querySelector('button'); + + if (!button) { + throw new Error('Expected button to be rendered'); + } + + expect(button.textContent).toBe('Demo Button'); + + unmount(component); + target.remove(); +}); diff --git a/packages/create-rstack/template-lib-svelte-ts/AGENTS.md b/packages/create-rstack/template-lib-svelte-ts/AGENTS.md new file mode 100644 index 00000000..234cc720 --- /dev/null +++ b/packages/create-rstack/template-lib-svelte-ts/AGENTS.md @@ -0,0 +1,14 @@ +# AGENTS.md + +## Commands + +- `{{ packageManager }} run build` - Build the library for production +- `{{ packageManager }} run dev` - Rebuild the library when source files change +- `{{ packageManager }} run test` - Run tests +- `{{ packageManager }} run test:watch` - Run tests in watch mode + +## Docs + +- Rslib: https://rslib.rs/llms.txt +- Rspack: https://rspack.rs/llms.txt +- Rstest: https://rstest.rs/llms.txt diff --git a/packages/create-rstack/template-lib-svelte-ts/README.md b/packages/create-rstack/template-lib-svelte-ts/README.md new file mode 100644 index 00000000..ab4b6927 --- /dev/null +++ b/packages/create-rstack/template-lib-svelte-ts/README.md @@ -0,0 +1,40 @@ +# Rstack library + +## Setup + +Install the dependencies: + +```bash +{{ packageManager }} install +``` + +## Get started + +Build the library: + +```bash +{{ packageManager }} run build +``` + +Build the library in watch mode: + +```bash +{{ packageManager }} run dev +``` + +Run tests: + +```bash +{{ packageManager }} run test +``` + +Run tests in watch mode: + +```bash +{{ packageManager }} run test:watch +``` + +## Learn more + +- [Rstack documentation](https://rstack.rs) +- [Rslib documentation](https://rslib.rs) diff --git a/packages/create-rstack/template-lib-svelte-ts/package.json b/packages/create-rstack/template-lib-svelte-ts/package.json new file mode 100644 index 00000000..2c6022cb --- /dev/null +++ b/packages/create-rstack/template-lib-svelte-ts/package.json @@ -0,0 +1,41 @@ +{ + "name": "rstack-lib-svelte-ts", + "version": "0.0.0", + "type": "module", + "exports": { + ".": { + "types": "./dist/index.d.ts", + "default": "./dist/index.js" + } + }, + "types": "./dist/index.d.ts", + "files": [ + "dist", + "README.md" + ], + "scripts": { + "build": "svelte-check && rs lib", + "dev": "rs lib --watch", + "format": "rs fmt", + "lint": "rs lint", + "test": "rs test", + "test:watch": "rs test --watch" + }, + "devDependencies": { + "@rsbuild/plugin-svelte": "^2.0.1", + "@types/node": "^24.13.3", + "happy-dom": "^20.11.1", + "prettier-plugin-svelte": "^4.1.1", + "rstack": "^0.3.5", + "svelte": "^5.56.8", + "svelte-check": "^4.7.4", + "svelte2tsx": "^0.7.59", + "typescript": "^6.0.3" + }, + "peerDependencies": { + "svelte": "^5.0.0" + }, + "publishConfig": { + "access": "public" + } +} diff --git a/packages/create-rstack/template-lib-svelte-ts/rstack.config.ts b/packages/create-rstack/template-lib-svelte-ts/rstack.config.ts new file mode 100644 index 00000000..463c0e54 --- /dev/null +++ b/packages/create-rstack/template-lib-svelte-ts/rstack.config.ts @@ -0,0 +1,34 @@ +// Rstack configuration guide: https://rstack.rs/config +import { define } from 'rstack'; +import { svelteDtsPlugin } from './scripts/rslib-plugin-svelte-dts.ts'; + +define.lib(async () => { + const { pluginSvelte } = await import('@rsbuild/plugin-svelte'); + + return { + bundle: false, + source: { + entry: { + index: ['./src/**'], + }, + }, + output: { + target: 'web', + }, + plugins: [pluginSvelte(), svelteDtsPlugin()], + }; +}); + +define.test({ + testEnvironment: 'happy-dom', +}); + +define.lint(async () => { + const { js, ts } = await import('rstack/lint'); + + return [js.configs.recommended, ts.configs.recommended]; +}); + +define.fmt({ + plugins: ['prettier-plugin-svelte'], +}); diff --git a/packages/create-rstack/template-lib-svelte-ts/scripts/rslib-plugin-svelte-dts.ts b/packages/create-rstack/template-lib-svelte-ts/scripts/rslib-plugin-svelte-dts.ts new file mode 100644 index 00000000..34560f81 --- /dev/null +++ b/packages/create-rstack/template-lib-svelte-ts/scripts/rslib-plugin-svelte-dts.ts @@ -0,0 +1,46 @@ +import type { RsbuildPlugin } from 'rstack/lib'; +import { resolve } from 'node:path'; +import { fileURLToPath } from 'node:url'; +import { emitDts, type EmitDtsConfig } from 'svelte2tsx'; + +type SvelteDtsPluginOptions = Partial; + +const resolveProjectPath = (rootPath: string, path: string): string => resolve(rootPath, path); + +export function svelteDtsPlugin(options: SvelteDtsPluginOptions = {}): RsbuildPlugin { + return { + name: 'rslib-plugin-svelte-dts', + setup(api) { + api.onAfterBuild(async ({ isWatch }) => { + if (!isWatch) { + api.logger.start('generating declaration files...'); + } + + const { declarationDir = './dist', libRoot = './src', tsconfig } = options; + const rootPath = api.context.rootPath; + const tsconfigPath = resolveProjectPath( + rootPath, + tsconfig ?? api.getNormalizedConfig().source.tsconfigPath ?? './tsconfig.json', + ); + const svelteShimsPath = options.svelteShimsPath + ? resolveProjectPath(rootPath, options.svelteShimsPath) + : fileURLToPath(import.meta.resolve('svelte2tsx/svelte-shims-v4.d.ts')); + + try { + await emitDts({ + declarationDir: resolveProjectPath(rootPath, declarationDir), + svelteShimsPath, + libRoot: resolveProjectPath(rootPath, libRoot), + tsconfig: tsconfigPath, + }); + + api.logger.ready('declaration files generated with svelte2tsx.'); + } catch (error) { + api.logger.error('Failed to generate declaration files with svelte2tsx.'); + api.logger.error(error); + throw error; + } + }); + }, + }; +} diff --git a/packages/create-rstack/template-lib-svelte-ts/src/Button.svelte b/packages/create-rstack/template-lib-svelte-ts/src/Button.svelte new file mode 100644 index 00000000..24a4391f --- /dev/null +++ b/packages/create-rstack/template-lib-svelte-ts/src/Button.svelte @@ -0,0 +1,34 @@ + + + diff --git a/packages/create-rstack/template-lib-svelte-ts/src/button.css b/packages/create-rstack/template-lib-svelte-ts/src/button.css new file mode 100644 index 00000000..257ef46f --- /dev/null +++ b/packages/create-rstack/template-lib-svelte-ts/src/button.css @@ -0,0 +1,34 @@ +.demo-button { + font-weight: 700; + border: 0; + border-radius: 3em; + cursor: pointer; + display: inline-block; + line-height: 1; +} + +.demo-button--primary { + color: white; + background-color: #1ea7fd; +} + +.demo-button--secondary { + color: #333; + background-color: transparent; + box-shadow: rgba(0, 0, 0, 0.15) 0 0 0 1px inset; +} + +.demo-button--small { + font-size: 12px; + padding: 10px 16px; +} + +.demo-button--medium { + font-size: 14px; + padding: 11px 20px; +} + +.demo-button--large { + font-size: 16px; + padding: 12px 24px; +} diff --git a/packages/create-rstack/template-lib-svelte-ts/src/index.ts b/packages/create-rstack/template-lib-svelte-ts/src/index.ts new file mode 100644 index 00000000..ae34e39c --- /dev/null +++ b/packages/create-rstack/template-lib-svelte-ts/src/index.ts @@ -0,0 +1 @@ +export { default as Button } from './Button.svelte'; diff --git a/packages/create-rstack/template-lib-svelte-ts/tests/index.test.ts b/packages/create-rstack/template-lib-svelte-ts/tests/index.test.ts new file mode 100644 index 00000000..cfcfa131 --- /dev/null +++ b/packages/create-rstack/template-lib-svelte-ts/tests/index.test.ts @@ -0,0 +1,19 @@ +import { expect, test } from 'rstack/test'; +import { mount, unmount } from 'svelte'; +import Button from '../src/Button.svelte'; + +test('The button should render the default label', () => { + const target = document.createElement('div'); + document.body.append(target); + const component = mount(Button, { target }); + const button = target.querySelector('button'); + + if (!button) { + throw new Error('Expected button to be rendered'); + } + + expect(button.textContent).toBe('Demo Button'); + + unmount(component); + target.remove(); +}); diff --git a/packages/create-rstack/template-lib-svelte-ts/tests/tsconfig.json b/packages/create-rstack/template-lib-svelte-ts/tests/tsconfig.json new file mode 100644 index 00000000..91484919 --- /dev/null +++ b/packages/create-rstack/template-lib-svelte-ts/tests/tsconfig.json @@ -0,0 +1,7 @@ +{ + "extends": "../tsconfig.json", + "compilerOptions": { + "rootDir": ".." + }, + "include": ["./"] +} diff --git a/packages/create-rstack/template-lib-svelte-ts/tsconfig.json b/packages/create-rstack/template-lib-svelte-ts/tsconfig.json new file mode 100644 index 00000000..e69b0204 --- /dev/null +++ b/packages/create-rstack/template-lib-svelte-ts/tsconfig.json @@ -0,0 +1,25 @@ +{ + "compilerOptions": { + "lib": ["DOM", "ES2022"], + "target": "ES2022", + "declaration": true, + "emitDeclarationOnly": true, + "isolatedModules": true, + "skipLibCheck": true, + "types": ["rstack/types", "node", "svelte"], + "useDefineForClassFields": true, + + /* modules */ + "module": "preserve", + "moduleDetection": "force", + "moduleResolution": "bundler", + "verbatimModuleSyntax": true, + "resolveJsonModule": true, + "allowImportingTsExtensions": true, + + /* type checking */ + "noUnusedLocals": true, + "noUnusedParameters": true + }, + "include": ["src", "scripts", "*.config.ts"] +} diff --git a/packages/create-rstack/tests/create.test.ts b/packages/create-rstack/tests/create.test.ts index f89a62fe..5866a400 100644 --- a/packages/create-rstack/tests/create.test.ts +++ b/packages/create-rstack/tests/create.test.ts @@ -232,6 +232,18 @@ test.each([ sourceExtension: 'ts', hasTypeScript: true, }, + { + template: 'lib-svelte-js', + configExtension: 'js', + sourceExtension: 'js', + hasTypeScript: false, + }, + { + template: 'lib-svelte-ts', + configExtension: 'ts', + sourceExtension: 'ts', + hasTypeScript: true, + }, { template: 'lib-solid-js', configExtension: 'js', From ada2adc62edc881266b66c07e81ab8fdd59cd027 Mon Sep 17 00:00:00 2001 From: Jiahan Chen Date: Sun, 9 Aug 2026 08:48:58 +0800 Subject: [PATCH 14/76] ci(native): support Linux x64 glibc (#260) --- .github/workflows/reusable-native-build.yml | 90 +++++++++++++++++++++ packages/rstack/package.json | 4 +- 2 files changed, 93 insertions(+), 1 deletion(-) create mode 100644 .github/workflows/reusable-native-build.yml diff --git a/.github/workflows/reusable-native-build.yml b/.github/workflows/reusable-native-build.yml new file mode 100644 index 00000000..eac7d930 --- /dev/null +++ b/.github/workflows/reusable-native-build.yml @@ -0,0 +1,90 @@ +name: Reusable Native Build + +on: + workflow_call: + inputs: + target: + description: Rust target triple to build + required: true + type: string + runner: + description: GitHub-hosted runner label + required: true + type: string + filename: + description: Expected NAPI-RS binary filename + required: true + type: string + use_napi_cross: + description: Build with the NAPI-RS cross toolchain + default: false + required: false + type: boolean + +permissions: + contents: read + +env: + CARGO_INCREMENTAL: 0 + +jobs: + build: + name: Build ${{ inputs.target }} + runs-on: ${{ inputs.runner }} + env: + RUST_TARGET: ${{ inputs.target }} + steps: + - name: Checkout + uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7 + + - name: Setup Node.js + uses: actions/setup-node@820762786026740c76f36085b0efc47a31fe5020 # v7 + with: + node-version: 24.18.0 + package-manager-cache: false + + - name: Install Pnpm + uses: pnpm/action-setup@0ebf47130e4866e96fce0953f49152a61190b271 # v6.0.9 + with: + run_install: true + + - name: Install Rust target + shell: bash + run: rustup target add "$RUST_TARGET" + + - name: Build native binding with NAPI-RS cross toolchain + if: inputs.use_napi_cross + shell: bash + working-directory: packages/rstack + run: >- + pnpm exec napi build --platform --release + --target "$RUST_TARGET" + --manifest-path ../../Cargo.toml + --package rstack-binding + --package-json-path package.json + --output-dir . + --js binding.cjs + --dts binding.d.cts + --use-napi-cross + + - name: Build native binding + if: ${{ !inputs.use_napi_cross }} + shell: bash + working-directory: packages/rstack + run: >- + pnpm exec napi build --platform --release + --target "$RUST_TARGET" + --manifest-path ../../Cargo.toml + --package rstack-binding + --package-json-path package.json + --output-dir . + --js binding.cjs + --dts binding.d.cts + + - name: Upload native binding + uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7 + with: + name: native-${{ inputs.target }} + path: packages/rstack/${{ inputs.filename }} + if-no-files-found: error + retention-days: 1 diff --git a/packages/rstack/package.json b/packages/rstack/package.json index ce8b0c00..793c349e 100644 --- a/packages/rstack/package.json +++ b/packages/rstack/package.json @@ -116,6 +116,8 @@ "napi": { "binaryName": "rstack", "packageName": "@rstackjs/binding", - "targets": [] + "targets": [ + "x86_64-unknown-linux-gnu" + ] } } From d6fac70dd4b8e392eed5d9daa32b5c2dad41733a Mon Sep 17 00:00:00 2001 From: Jiahan Chen Date: Sun, 9 Aug 2026 11:38:10 +0800 Subject: [PATCH 15/76] feat(create-rstack): add check scripts to templates (#263) --- .../template-app-lit-js/package.json | 1 + .../template-app-lit-js/rstack.config.js | 4 +++ .../template-app-lit-ts/package.json | 1 + .../template-app-lit-ts/rstack.config.ts | 4 +++ .../template-app-preact-js/package.json | 1 + .../template-app-preact-js/rstack.config.js | 4 +++ .../template-app-preact-ts/package.json | 1 + .../template-app-preact-ts/rstack.config.ts | 4 +++ .../template-app-react-js/package.json | 1 + .../template-app-react-js/rstack.config.js | 4 +++ .../template-app-react-ts/package.json | 1 + .../template-app-react-ts/rstack.config.ts | 4 +++ .../template-app-solid-js/package.json | 1 + .../template-app-solid-js/rstack.config.js | 4 +++ .../template-app-solid-ts/package.json | 1 + .../template-app-solid-ts/rstack.config.ts | 4 +++ .../template-app-svelte-js/package.json | 1 + .../template-app-svelte-js/rstack.config.js | 1 + .../template-app-svelte-ts/package.json | 1 + .../template-app-svelte-ts/rstack.config.ts | 1 + .../template-app-vanilla-js/package.json | 1 + .../template-app-vanilla-js/rstack.config.js | 4 +++ .../template-app-vanilla-ts/package.json | 1 + .../template-app-vanilla-ts/rstack.config.ts | 4 +++ .../template-app-vue-js/package.json | 1 + .../template-app-vue-js/rstack.config.js | 4 +++ .../template-app-vue-ts/package.json | 1 + .../template-app-vue-ts/rstack.config.ts | 4 +++ .../template-doc-basic/package.json | 1 + .../template-doc-basic/rstack.config.ts | 4 +++ .../template-doc-i18n/package.json | 1 + .../template-doc-i18n/rstack.config.ts | 4 +++ .../template-lib-node-js/package.json | 1 + .../template-lib-node-js/rstack.config.js | 4 +++ .../template-lib-node-ts/package.json | 1 + .../template-lib-node-ts/rstack.config.ts | 4 +++ .../template-lib-react-js/package.json | 1 + .../template-lib-react-js/rstack.config.js | 4 +++ .../template-lib-react-js/src/Button.jsx | 8 +++++- .../template-lib-react-ts/package.json | 1 + .../template-lib-react-ts/rstack.config.ts | 4 +++ .../template-lib-solid-js/package.json | 1 + .../template-lib-solid-js/rstack.config.js | 4 +++ .../template-lib-solid-js/src/Button.jsx | 3 ++- .../template-lib-solid-ts/package.json | 1 + .../template-lib-solid-ts/rstack.config.ts | 4 +++ .../template-lib-solid-ts/src/Button.tsx | 3 ++- .../template-lib-svelte-js/package.json | 1 + .../template-lib-svelte-js/rstack.config.js | 1 + .../template-lib-svelte-ts/package.json | 1 + .../template-lib-svelte-ts/rstack.config.ts | 1 + .../scripts/rslib-plugin-svelte-dts.ts | 25 ++++++++++++++----- .../template-lib-vue-js/package.json | 1 + .../template-lib-vue-js/rstack.config.js | 4 +++ .../template-lib-vue-js/src/Button.vue | 4 ++- .../template-lib-vue-ts/package.json | 1 + .../template-lib-vue-ts/rstack.config.ts | 4 +++ .../template-lib-vue-ts/src/Button.vue | 4 ++- packages/create-rstack/tests/create.test.ts | 15 +++++++++++ rstack.config.ts | 8 ++++++ 60 files changed, 177 insertions(+), 11 deletions(-) diff --git a/packages/create-rstack/template-app-lit-js/package.json b/packages/create-rstack/template-app-lit-js/package.json index 80bd6755..2b5f2f65 100644 --- a/packages/create-rstack/template-app-lit-js/package.json +++ b/packages/create-rstack/template-app-lit-js/package.json @@ -5,6 +5,7 @@ "type": "module", "scripts": { "build": "rs build", + "check": "rs lint && rs fmt --check", "dev": "rs dev", "format": "rs fmt", "lint": "rs lint", diff --git a/packages/create-rstack/template-app-lit-js/rstack.config.js b/packages/create-rstack/template-app-lit-js/rstack.config.js index 2ff6f2bc..d09e1329 100644 --- a/packages/create-rstack/template-app-lit-js/rstack.config.js +++ b/packages/create-rstack/template-app-lit-js/rstack.config.js @@ -22,3 +22,7 @@ define.lint(async () => { return [js.configs.recommended]; }); + +define.fmt({ + singleQuote: true, +}); diff --git a/packages/create-rstack/template-app-lit-ts/package.json b/packages/create-rstack/template-app-lit-ts/package.json index cf2d0283..5aa39e56 100644 --- a/packages/create-rstack/template-app-lit-ts/package.json +++ b/packages/create-rstack/template-app-lit-ts/package.json @@ -5,6 +5,7 @@ "type": "module", "scripts": { "build": "rs build", + "check": "rs lint --type-check && rs fmt --check", "dev": "rs dev", "format": "rs fmt", "lint": "rs lint", diff --git a/packages/create-rstack/template-app-lit-ts/rstack.config.ts b/packages/create-rstack/template-app-lit-ts/rstack.config.ts index d9c137bb..cdfe0ac0 100644 --- a/packages/create-rstack/template-app-lit-ts/rstack.config.ts +++ b/packages/create-rstack/template-app-lit-ts/rstack.config.ts @@ -21,3 +21,7 @@ define.lint(async () => { return [js.configs.recommended, ts.configs.recommended]; }); + +define.fmt({ + singleQuote: true, +}); diff --git a/packages/create-rstack/template-app-preact-js/package.json b/packages/create-rstack/template-app-preact-js/package.json index 99faa0ff..49d5f7c5 100644 --- a/packages/create-rstack/template-app-preact-js/package.json +++ b/packages/create-rstack/template-app-preact-js/package.json @@ -5,6 +5,7 @@ "type": "module", "scripts": { "build": "rs build", + "check": "rs lint && rs fmt --check", "dev": "rs dev", "format": "rs fmt", "lint": "rs lint", diff --git a/packages/create-rstack/template-app-preact-js/rstack.config.js b/packages/create-rstack/template-app-preact-js/rstack.config.js index c3c22257..e2b64e47 100644 --- a/packages/create-rstack/template-app-preact-js/rstack.config.js +++ b/packages/create-rstack/template-app-preact-js/rstack.config.js @@ -23,3 +23,7 @@ define.lint(async () => { reactHooksPlugin.configs.recommended, ]; }); + +define.fmt({ + singleQuote: true, +}); diff --git a/packages/create-rstack/template-app-preact-ts/package.json b/packages/create-rstack/template-app-preact-ts/package.json index bfd249f9..56e7cd3d 100644 --- a/packages/create-rstack/template-app-preact-ts/package.json +++ b/packages/create-rstack/template-app-preact-ts/package.json @@ -5,6 +5,7 @@ "type": "module", "scripts": { "build": "rs build", + "check": "rs lint --type-check && rs fmt --check", "dev": "rs dev", "format": "rs fmt", "lint": "rs lint", diff --git a/packages/create-rstack/template-app-preact-ts/rstack.config.ts b/packages/create-rstack/template-app-preact-ts/rstack.config.ts index f3a2277e..9ee763c8 100644 --- a/packages/create-rstack/template-app-preact-ts/rstack.config.ts +++ b/packages/create-rstack/template-app-preact-ts/rstack.config.ts @@ -23,3 +23,7 @@ define.lint(async () => { reactHooksPlugin.configs.recommended, ]; }); + +define.fmt({ + singleQuote: true, +}); diff --git a/packages/create-rstack/template-app-react-js/package.json b/packages/create-rstack/template-app-react-js/package.json index 4c18be3f..ef4c7f83 100644 --- a/packages/create-rstack/template-app-react-js/package.json +++ b/packages/create-rstack/template-app-react-js/package.json @@ -5,6 +5,7 @@ "type": "module", "scripts": { "build": "rs build", + "check": "rs lint && rs fmt --check", "dev": "rs dev", "format": "rs fmt", "lint": "rs lint", diff --git a/packages/create-rstack/template-app-react-js/rstack.config.js b/packages/create-rstack/template-app-react-js/rstack.config.js index 44a86a4c..ddd9f056 100644 --- a/packages/create-rstack/template-app-react-js/rstack.config.js +++ b/packages/create-rstack/template-app-react-js/rstack.config.js @@ -23,3 +23,7 @@ define.lint(async () => { reactHooksPlugin.configs.recommended, ]; }); + +define.fmt({ + singleQuote: true, +}); diff --git a/packages/create-rstack/template-app-react-ts/package.json b/packages/create-rstack/template-app-react-ts/package.json index 5986ecdd..d184dd41 100644 --- a/packages/create-rstack/template-app-react-ts/package.json +++ b/packages/create-rstack/template-app-react-ts/package.json @@ -5,6 +5,7 @@ "type": "module", "scripts": { "build": "rs build", + "check": "rs lint --type-check && rs fmt --check", "dev": "rs dev", "format": "rs fmt", "lint": "rs lint", diff --git a/packages/create-rstack/template-app-react-ts/rstack.config.ts b/packages/create-rstack/template-app-react-ts/rstack.config.ts index 1e932f82..356c98e1 100644 --- a/packages/create-rstack/template-app-react-ts/rstack.config.ts +++ b/packages/create-rstack/template-app-react-ts/rstack.config.ts @@ -23,3 +23,7 @@ define.lint(async () => { reactHooksPlugin.configs.recommended, ]; }); + +define.fmt({ + singleQuote: true, +}); diff --git a/packages/create-rstack/template-app-solid-js/package.json b/packages/create-rstack/template-app-solid-js/package.json index cd2dea89..784be3d5 100644 --- a/packages/create-rstack/template-app-solid-js/package.json +++ b/packages/create-rstack/template-app-solid-js/package.json @@ -5,6 +5,7 @@ "type": "module", "scripts": { "build": "rs build", + "check": "rs lint && rs fmt --check", "dev": "rs dev", "format": "rs fmt", "lint": "rs lint", diff --git a/packages/create-rstack/template-app-solid-js/rstack.config.js b/packages/create-rstack/template-app-solid-js/rstack.config.js index 13c7ae98..80b7b6f7 100644 --- a/packages/create-rstack/template-app-solid-js/rstack.config.js +++ b/packages/create-rstack/template-app-solid-js/rstack.config.js @@ -25,3 +25,7 @@ define.lint(async () => { return [js.configs.recommended]; }); + +define.fmt({ + singleQuote: true, +}); diff --git a/packages/create-rstack/template-app-solid-ts/package.json b/packages/create-rstack/template-app-solid-ts/package.json index e437464e..a91b7771 100644 --- a/packages/create-rstack/template-app-solid-ts/package.json +++ b/packages/create-rstack/template-app-solid-ts/package.json @@ -5,6 +5,7 @@ "type": "module", "scripts": { "build": "rs build", + "check": "rs lint --type-check && rs fmt --check", "dev": "rs dev", "format": "rs fmt", "lint": "rs lint", diff --git a/packages/create-rstack/template-app-solid-ts/rstack.config.ts b/packages/create-rstack/template-app-solid-ts/rstack.config.ts index 37e2a1c8..355d1b46 100644 --- a/packages/create-rstack/template-app-solid-ts/rstack.config.ts +++ b/packages/create-rstack/template-app-solid-ts/rstack.config.ts @@ -24,3 +24,7 @@ define.lint(async () => { return [js.configs.recommended, ts.configs.recommended]; }); + +define.fmt({ + singleQuote: true, +}); diff --git a/packages/create-rstack/template-app-svelte-js/package.json b/packages/create-rstack/template-app-svelte-js/package.json index 5d94fced..34a71ae1 100644 --- a/packages/create-rstack/template-app-svelte-js/package.json +++ b/packages/create-rstack/template-app-svelte-js/package.json @@ -5,6 +5,7 @@ "type": "module", "scripts": { "build": "rs build", + "check": "rs lint && rs fmt --check", "dev": "rs dev", "format": "rs fmt", "lint": "rs lint", diff --git a/packages/create-rstack/template-app-svelte-js/rstack.config.js b/packages/create-rstack/template-app-svelte-js/rstack.config.js index 62129297..742edde8 100644 --- a/packages/create-rstack/template-app-svelte-js/rstack.config.js +++ b/packages/create-rstack/template-app-svelte-js/rstack.config.js @@ -22,4 +22,5 @@ define.lint(async () => { define.fmt({ plugins: ['prettier-plugin-svelte'], + singleQuote: true, }); diff --git a/packages/create-rstack/template-app-svelte-ts/package.json b/packages/create-rstack/template-app-svelte-ts/package.json index 98d3a746..0c65dd3d 100644 --- a/packages/create-rstack/template-app-svelte-ts/package.json +++ b/packages/create-rstack/template-app-svelte-ts/package.json @@ -5,6 +5,7 @@ "type": "module", "scripts": { "build": "svelte-check && rs build", + "check": "rs lint && rs fmt --check", "dev": "rs dev", "format": "rs fmt", "lint": "rs lint", diff --git a/packages/create-rstack/template-app-svelte-ts/rstack.config.ts b/packages/create-rstack/template-app-svelte-ts/rstack.config.ts index 70d77ca6..66320b37 100644 --- a/packages/create-rstack/template-app-svelte-ts/rstack.config.ts +++ b/packages/create-rstack/template-app-svelte-ts/rstack.config.ts @@ -21,4 +21,5 @@ define.lint(async () => { define.fmt({ plugins: ['prettier-plugin-svelte'], + singleQuote: true, }); diff --git a/packages/create-rstack/template-app-vanilla-js/package.json b/packages/create-rstack/template-app-vanilla-js/package.json index e74baa5e..2074fc46 100644 --- a/packages/create-rstack/template-app-vanilla-js/package.json +++ b/packages/create-rstack/template-app-vanilla-js/package.json @@ -5,6 +5,7 @@ "type": "module", "scripts": { "build": "rs build", + "check": "rs lint && rs fmt --check", "dev": "rs dev", "format": "rs fmt", "lint": "rs lint", diff --git a/packages/create-rstack/template-app-vanilla-js/rstack.config.js b/packages/create-rstack/template-app-vanilla-js/rstack.config.js index 6b6c5f7d..23e75fdf 100644 --- a/packages/create-rstack/template-app-vanilla-js/rstack.config.js +++ b/packages/create-rstack/template-app-vanilla-js/rstack.config.js @@ -15,3 +15,7 @@ define.lint(async () => { return [js.configs.recommended]; }); + +define.fmt({ + singleQuote: true, +}); diff --git a/packages/create-rstack/template-app-vanilla-ts/package.json b/packages/create-rstack/template-app-vanilla-ts/package.json index ad5c1c12..c7d21790 100644 --- a/packages/create-rstack/template-app-vanilla-ts/package.json +++ b/packages/create-rstack/template-app-vanilla-ts/package.json @@ -5,6 +5,7 @@ "type": "module", "scripts": { "build": "rs build", + "check": "rs lint --type-check && rs fmt --check", "dev": "rs dev", "format": "rs fmt", "lint": "rs lint", diff --git a/packages/create-rstack/template-app-vanilla-ts/rstack.config.ts b/packages/create-rstack/template-app-vanilla-ts/rstack.config.ts index 1add94e8..349fcfae 100644 --- a/packages/create-rstack/template-app-vanilla-ts/rstack.config.ts +++ b/packages/create-rstack/template-app-vanilla-ts/rstack.config.ts @@ -14,3 +14,7 @@ define.lint(async () => { return [js.configs.recommended, ts.configs.recommended]; }); + +define.fmt({ + singleQuote: true, +}); diff --git a/packages/create-rstack/template-app-vue-js/package.json b/packages/create-rstack/template-app-vue-js/package.json index d5060e03..e4b32f0a 100644 --- a/packages/create-rstack/template-app-vue-js/package.json +++ b/packages/create-rstack/template-app-vue-js/package.json @@ -5,6 +5,7 @@ "type": "module", "scripts": { "build": "rs build", + "check": "rs lint && rs fmt --check", "dev": "rs dev", "format": "rs fmt", "lint": "rs lint", diff --git a/packages/create-rstack/template-app-vue-js/rstack.config.js b/packages/create-rstack/template-app-vue-js/rstack.config.js index 7e691606..b67b85e1 100644 --- a/packages/create-rstack/template-app-vue-js/rstack.config.js +++ b/packages/create-rstack/template-app-vue-js/rstack.config.js @@ -19,3 +19,7 @@ define.lint(async () => { return [js.configs.recommended]; }); + +define.fmt({ + singleQuote: true, +}); diff --git a/packages/create-rstack/template-app-vue-ts/package.json b/packages/create-rstack/template-app-vue-ts/package.json index a408bb83..a93dbdc6 100644 --- a/packages/create-rstack/template-app-vue-ts/package.json +++ b/packages/create-rstack/template-app-vue-ts/package.json @@ -5,6 +5,7 @@ "type": "module", "scripts": { "build": "vue-tsc && rs build", + "check": "rs lint && rs fmt --check", "dev": "rs dev", "format": "rs fmt", "lint": "rs lint", diff --git a/packages/create-rstack/template-app-vue-ts/rstack.config.ts b/packages/create-rstack/template-app-vue-ts/rstack.config.ts index 1184c387..f2224449 100644 --- a/packages/create-rstack/template-app-vue-ts/rstack.config.ts +++ b/packages/create-rstack/template-app-vue-ts/rstack.config.ts @@ -18,3 +18,7 @@ define.lint(async () => { return [js.configs.recommended, ts.configs.recommended]; }); + +define.fmt({ + singleQuote: true, +}); diff --git a/packages/create-rstack/template-doc-basic/package.json b/packages/create-rstack/template-doc-basic/package.json index fa5f892a..47bbfba9 100644 --- a/packages/create-rstack/template-doc-basic/package.json +++ b/packages/create-rstack/template-doc-basic/package.json @@ -5,6 +5,7 @@ "type": "module", "scripts": { "build": "rs doc build", + "check": "rs lint --type-check && rs fmt --check", "dev": "rs doc", "format": "rs fmt", "lint": "rs lint", diff --git a/packages/create-rstack/template-doc-basic/rstack.config.ts b/packages/create-rstack/template-doc-basic/rstack.config.ts index 550d8823..466b9d5c 100644 --- a/packages/create-rstack/template-doc-basic/rstack.config.ts +++ b/packages/create-rstack/template-doc-basic/rstack.config.ts @@ -17,3 +17,7 @@ define.lint(async () => { reactHooksPlugin.configs.recommended, ]; }); + +define.fmt({ + singleQuote: true, +}); diff --git a/packages/create-rstack/template-doc-i18n/package.json b/packages/create-rstack/template-doc-i18n/package.json index 9f368fb2..bbe5afd6 100644 --- a/packages/create-rstack/template-doc-i18n/package.json +++ b/packages/create-rstack/template-doc-i18n/package.json @@ -5,6 +5,7 @@ "type": "module", "scripts": { "build": "rs doc build", + "check": "rs lint --type-check && rs fmt --check", "dev": "rs doc", "format": "rs fmt", "lint": "rs lint", diff --git a/packages/create-rstack/template-doc-i18n/rstack.config.ts b/packages/create-rstack/template-doc-i18n/rstack.config.ts index e599efda..2ab17eff 100644 --- a/packages/create-rstack/template-doc-i18n/rstack.config.ts +++ b/packages/create-rstack/template-doc-i18n/rstack.config.ts @@ -33,3 +33,7 @@ define.lint(async () => { reactHooksPlugin.configs.recommended, ]; }); + +define.fmt({ + singleQuote: true, +}); diff --git a/packages/create-rstack/template-lib-node-js/package.json b/packages/create-rstack/template-lib-node-js/package.json index d586a11b..5fc1f1c3 100644 --- a/packages/create-rstack/template-lib-node-js/package.json +++ b/packages/create-rstack/template-lib-node-js/package.json @@ -14,6 +14,7 @@ ], "scripts": { "build": "rs lib", + "check": "rs lint && rs fmt --check", "dev": "rs lib --watch", "format": "rs fmt", "lint": "rs lint", diff --git a/packages/create-rstack/template-lib-node-js/rstack.config.js b/packages/create-rstack/template-lib-node-js/rstack.config.js index 4d3e4b05..3f62051d 100644 --- a/packages/create-rstack/template-lib-node-js/rstack.config.js +++ b/packages/create-rstack/template-lib-node-js/rstack.config.js @@ -15,3 +15,7 @@ define.lint(async () => { return [js.configs.recommended]; }); + +define.fmt({ + singleQuote: true, +}); diff --git a/packages/create-rstack/template-lib-node-ts/package.json b/packages/create-rstack/template-lib-node-ts/package.json index 4805daf9..da1900ac 100644 --- a/packages/create-rstack/template-lib-node-ts/package.json +++ b/packages/create-rstack/template-lib-node-ts/package.json @@ -16,6 +16,7 @@ ], "scripts": { "build": "rs lib", + "check": "rs lint --type-check && rs fmt --check", "dev": "rs lib --watch", "format": "rs fmt", "lint": "rs lint", diff --git a/packages/create-rstack/template-lib-node-ts/rstack.config.ts b/packages/create-rstack/template-lib-node-ts/rstack.config.ts index bee703a8..d0f94060 100644 --- a/packages/create-rstack/template-lib-node-ts/rstack.config.ts +++ b/packages/create-rstack/template-lib-node-ts/rstack.config.ts @@ -15,3 +15,7 @@ define.lint(async () => { return [js.configs.recommended, ts.configs.recommended]; }); + +define.fmt({ + singleQuote: true, +}); diff --git a/packages/create-rstack/template-lib-react-js/package.json b/packages/create-rstack/template-lib-react-js/package.json index 7580d09f..cd01c6d3 100644 --- a/packages/create-rstack/template-lib-react-js/package.json +++ b/packages/create-rstack/template-lib-react-js/package.json @@ -13,6 +13,7 @@ ], "scripts": { "build": "rs lib", + "check": "rs lint && rs fmt --check", "dev": "rs lib --watch", "format": "rs fmt", "lint": "rs lint", diff --git a/packages/create-rstack/template-lib-react-js/rstack.config.js b/packages/create-rstack/template-lib-react-js/rstack.config.js index 30b3b512..3ef9c799 100644 --- a/packages/create-rstack/template-lib-react-js/rstack.config.js +++ b/packages/create-rstack/template-lib-react-js/rstack.config.js @@ -32,3 +32,7 @@ define.lint(async () => { reactHooksPlugin.configs.recommended, ]; }); + +define.fmt({ + singleQuote: true, +}); diff --git a/packages/create-rstack/template-lib-react-js/src/Button.jsx b/packages/create-rstack/template-lib-react-js/src/Button.jsx index 91960089..1e0570fb 100644 --- a/packages/create-rstack/template-lib-react-js/src/Button.jsx +++ b/packages/create-rstack/template-lib-react-js/src/Button.jsx @@ -1,6 +1,12 @@ import './button.css'; -export const Button = ({ primary = false, size = 'medium', backgroundColor, label, ...props }) => { +export const Button = ({ + primary = false, + size = 'medium', + backgroundColor, + label, + ...props +}) => { const mode = primary ? 'demo-button--primary' : 'demo-button--secondary'; return (