Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Migrate Trpc Plugin to new structure #403

Draft
wants to merge 1 commit into
base: main
Choose a base branch
from
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
13 changes: 13 additions & 0 deletions packages/trpc/.eslintignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
.DS_Store
node_modules
/build
/.svelte-kit
/package
.env
.env.*
!.env.example

# Ignore files for PNPM, NPM and YARN
pnpm-lock.yaml
package-lock.json
yarn.lock
30 changes: 30 additions & 0 deletions packages/trpc/.eslintrc.cjs
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
module.exports = {
root: true,
extends: [
'eslint:recommended',
'plugin:@typescript-eslint/recommended',
'plugin:svelte/recommended',
'prettier'
],
parser: '@typescript-eslint/parser',
plugins: ['@typescript-eslint'],
parserOptions: {
sourceType: 'module',
ecmaVersion: 2020,
extraFileExtensions: ['.svelte']
},
env: {
browser: true,
es2017: true,
node: true
},
overrides: [
{
files: ['*.svelte'],
parser: 'svelte-eslint-parser',
parserOptions: {
parser: '@typescript-eslint/parser'
}
}
]
};
11 changes: 11 additions & 0 deletions packages/trpc/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
.DS_Store
node_modules
/build
/dist
/.svelte-kit
/package
.env
.env.*
!.env.example
vite.config.js.timestamp-*
vite.config.ts.timestamp-*
2 changes: 2 additions & 0 deletions packages/trpc/.npmrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
engine-strict=true
resolution-mode=highest
13 changes: 13 additions & 0 deletions packages/trpc/.prettierignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
.DS_Store
node_modules
/build
/.svelte-kit
/package
.env
.env.*
!.env.example

# Ignore files for PNPM, NPM and YARN
pnpm-lock.yaml
package-lock.json
yarn.lock
9 changes: 9 additions & 0 deletions packages/trpc/.prettierrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
{
"useTabs": true,
"singleQuote": true,
"trailingComma": "none",
"printWidth": 100,
"plugins": ["prettier-plugin-svelte"],
"pluginSearchDirs": ["."],
"overrides": [{ "files": "*.svelte", "options": { "parser": "svelte" } }]
}
58 changes: 58 additions & 0 deletions packages/trpc/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,58 @@
# create-svelte

Everything you need to build a Svelte library, powered by [`create-svelte`](https://github.com/sveltejs/kit/tree/master/packages/create-svelte).

Read more about creating a library [in the docs](https://kit.svelte.dev/docs/packaging).

## Creating a project

If you're seeing this, you've probably already done this step. Congrats!

```bash
# create a new project in the current directory
npm create svelte@latest

# create a new project in my-app
npm create svelte@latest my-app
```

## Developing

Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:

```bash
npm run dev

# or start the server and open the app in a new browser tab
npm run dev -- --open
```

Everything inside `src/lib` is part of your library, everything inside `src/routes` can be used as a showcase or preview app.

## Building

To build your library:

```bash
npm run package
```

To create a production version of your showcase app:

```bash
npm run build
```

You can preview the production build with `npm run preview`.

> To deploy your app, you may need to install an [adapter](https://kit.svelte.dev/docs/adapters) for your target environment.

## Publishing

Go into the `package.json` and give your package the desired name through the `"name"` option. Also consider adding a `"license"` field and point it to a `LICENSE` file which you can create from a template (one popular option is the [MIT license](https://opensource.org/license/mit/)).

To publish your library to [npm](https://www.npmjs.com):

```bash
npm publish
```
68 changes: 68 additions & 0 deletions packages/trpc/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,68 @@
{
"name": "webstone-plugin-trpc",
"version": "0.0.1",
"scripts": {
"build": "npm run clean:build && npm run cli:build && npm run web:build",
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
"clean:build": "rimraf ./dist",
"cli:build": "node scripts/build-cli.js build && npm run templates:copy",
"cli:dev": "node scripts/build-cli.js dev",
"dev": "npm run clean:build && npm-run-all --parallel cli:dev web:dev templates:dev",
"format": "prettier --plugin-search-dir . --write .",
"lint": "prettier --plugin-search-dir . --check . && eslint .",
"package": "svelte-kit sync && svelte-package -o ./dist/web && publint",
"prepublishOnly": "npm run package",
"preview": "vite preview",
"templates:copy": "cp -a ./src/cli/templates ./dist/cli",
"templates:dev": "nodemon --watch src/cli/templates --ext '.ejs' --exec 'npm run templates:copy'",
"test": "npm run test:integration && npm run test:unit",
"test:integration": "playwright test",
"test:unit": "vitest",
"web:build": "vite build && npm run package",
"web:dev": "vite dev"
},
"exports": {
".": {
"types": "./dist/web/index.d.ts",
"svelte": "./dist/web/index.js"
}
},
"files": [
"dist",
"!dist/**/*.test.*",
"!dist/**/*.spec.*"
],
"peerDependencies": {
"svelte": "^4.0.0"
},
"devDependencies": {
"@playwright/test": "^1.28.1",
"@sveltejs/adapter-auto": "^2.0.0",
"@sveltejs/kit": "^1.20.4",
"@sveltejs/package": "^2.0.0",
"@typescript-eslint/eslint-plugin": "^5.45.0",
"@typescript-eslint/parser": "^5.45.0",
"@webstone/gluegun": "0.0.5",
"eslint": "^8.28.0",
"eslint-config-prettier": "^8.5.0",
"eslint-plugin-svelte": "^2.30.0",
"fs-jetpack": "^5.1.0",
"nodemon": "^3.0.1",
"npm-run-all": "^4.1.5",
"prettier": "^2.8.0",
"prettier-plugin-svelte": "^2.10.1",
"publint": "^0.1.9",
"rimraf": "^3.0.2",
"svelte": "^4.0.5",
"svelte-check": "^3.4.3",
"tslib": "^2.4.1",
"tsup": "^6.7.0",
"typescript": "^5.0.0",
"vite": "^4.4.2",
"vitest": "^0.32.2"
},
"svelte": "./dist/web/index.js",
"types": "./dist/web/index.d.ts",
"type": "module"
}
12 changes: 12 additions & 0 deletions packages/trpc/playwright.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
import type { PlaywrightTestConfig } from '@playwright/test';

const config: PlaywrightTestConfig = {
webServer: {
command: 'npm run build && npm run preview',
port: 4173
},
testDir: 'tests',
testMatch: /(.+\.)?(test|spec)\.[jt]s/
};

export default config;
35 changes: 35 additions & 0 deletions packages/trpc/scripts/build-cli.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
import { defineConfig, build } from 'tsup';
import jetpack from 'fs-jetpack';

/**
* @type {"build" | "dev"}
*/
const mode = process.argv[2];

// check if mode is valid
if (!['build', 'dev'].includes(mode)) {
console.log('Usage: node ./scripts/build-cli.js build|dev');
process.exit(1);
}

const config = defineConfig({
entry: ['src/cli/**/*.ts'],
outDir: 'dist/cli',
splitting: true,
target: 'es6',
format: 'cjs',
clean: true,
treeshake: true,
tsconfig: './tsconfig.json',
bundle: false,
minify: true,
watch: mode === 'dev' ? ['src/cli'] : false
});

const tsFiles = jetpack.cwd('src/cli').find({ matching: '*.ts', recursive: true });
const tsFilesCount = tsFiles.length;
if (tsFilesCount === 0) {
console.log('No files to build');
process.exit(1);
}
await build(config);
12 changes: 12 additions & 0 deletions packages/trpc/src/app.d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
// See https://kit.svelte.dev/docs/types#app
// for information about these interfaces
declare global {
namespace App {
// interface Error {}
// interface Locals {}
// interface PageData {}
// interface Platform {}
}
}

export {};
12 changes: 12 additions & 0 deletions packages/trpc/src/app.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
%sveltekit.head%
</head>
<body data-sveltekit-preload-data="hover">
<div>%sveltekit.body%</div>
</body>
</html>
16 changes: 16 additions & 0 deletions packages/trpc/src/cli/commands/trpc/hello-world.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
import type { GluegunCommand } from '@webstone/gluegun';

const command: GluegunCommand = {
name: 'hello',
alias: ['h'],
description: 'Hello World Command',
hidden: false,
dashed: false,
run: async (toolbox) => {
const { print } = toolbox;

print.info(`Hello World`);
}
};

export default command;
11 changes: 11 additions & 0 deletions packages/trpc/src/cli/extensions/hello-world.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
import type { GluegunToolbox } from '@webstone/gluegun';

const extension = (toolbox: GluegunToolbox) => {
const { print } = toolbox;

toolbox.sayhello = () => {
print.info('Hello from an extension!');
};
};

export default extension;
1 change: 1 addition & 0 deletions packages/trpc/src/cli/templates/template.ejs
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
<h1>Template</h1>
7 changes: 7 additions & 0 deletions packages/trpc/src/index.test.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
import { describe, it, expect } from 'vitest';

describe('sum test', () => {
it('adds 1 + 2 to equal 3', () => {
expect(1 + 2).toBe(3);
});
});
1 change: 1 addition & 0 deletions packages/trpc/src/lib/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
// Reexport your entry components here
3 changes: 3 additions & 0 deletions packages/trpc/src/routes/+page.svelte
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
<h1>Welcome to your library project</h1>
<p>Create your package using @sveltejs/package and preview/showcase your work with SvelteKit</p>
<p>Visit <a href="https://kit.svelte.dev">kit.svelte.dev</a> to read the documentation</p>
Binary file added packages/trpc/static/favicon.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
18 changes: 18 additions & 0 deletions packages/trpc/svelte.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
import adapter from '@sveltejs/adapter-auto';
import { vitePreprocess } from '@sveltejs/kit/vite';

/** @type {import('@sveltejs/kit').Config} */
const config = {
// Consult https://kit.svelte.dev/docs/integrations#preprocessors
// for more information about preprocessors
preprocess: vitePreprocess(),

kit: {
// adapter-auto only supports some environments, see https://kit.svelte.dev/docs/adapter-auto for a list.
// If your environment is not supported or you settled on a specific environment, switch out the adapter.
// See https://kit.svelte.dev/docs/adapters for more information about adapters.
adapter: adapter()
}
};

export default config;
6 changes: 6 additions & 0 deletions packages/trpc/tests/test.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
import { expect, test } from '@playwright/test';

test('index page has expected h1', async ({ page }) => {
await page.goto('/');
await expect(page.getByRole('heading', { name: 'Welcome to SvelteKit' })).toBeVisible();
});
14 changes: 14 additions & 0 deletions packages/trpc/tsconfig.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
{
"extends": "./.svelte-kit/tsconfig.json",
"compilerOptions": {
"allowJs": true,
"checkJs": true,
"esModuleInterop": true,
"forceConsistentCasingInFileNames": true,
"resolveJsonModule": true,
"skipLibCheck": true,
"sourceMap": true,
"strict": true,
"moduleResolution": "NodeNext"
}
}
9 changes: 9 additions & 0 deletions packages/trpc/vite.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vitest/config';

export default defineConfig({
plugins: [sveltekit()],
test: {
include: ['src/**/*.{test,spec}.{js,ts}']
}
});
Loading