From a3ef93834334f48249b91edd440779805c6c2d27 Mon Sep 17 00:00:00 2001 From: linbudu599 Date: Fri, 18 Mar 2022 11:12:58 +0800 Subject: [PATCH] feat: vite lit starter --- ROADMAP.md | 1 - packages/vite-lit-starter/.gitignore | 24 ++++++++ packages/vite-lit-starter/index.html | 15 +++++ packages/vite-lit-starter/package.json | 25 +++++++++ packages/vite-lit-starter/src/favicon.svg | 15 +++++ packages/vite-lit-starter/src/my-element.ts | 58 ++++++++++++++++++++ packages/vite-lit-starter/src/vite-env.d.ts | 1 + packages/vite-lit-starter/tsconfig.json | 21 +++++++ packages/vite-lit-starter/tsconfig.node.json | 8 +++ packages/vite-lit-starter/vite.config.ts | 14 +++++ pnpm-lock.yaml | 50 ++++++++--------- 11 files changed, 205 insertions(+), 27 deletions(-) create mode 100644 packages/vite-lit-starter/.gitignore create mode 100644 packages/vite-lit-starter/index.html create mode 100644 packages/vite-lit-starter/package.json create mode 100644 packages/vite-lit-starter/src/favicon.svg create mode 100644 packages/vite-lit-starter/src/my-element.ts create mode 100644 packages/vite-lit-starter/src/vite-env.d.ts create mode 100644 packages/vite-lit-starter/tsconfig.json create mode 100644 packages/vite-lit-starter/tsconfig.node.json create mode 100644 packages/vite-lit-starter/vite.config.ts diff --git a/ROADMAP.md b/ROADMAP.md index 4fc7838..54cbbd0 100644 --- a/ROADMAP.md +++ b/ROADMAP.md @@ -5,7 +5,6 @@ ## Advanced(Stage 3) - StoryBook -- Lit - Midway Hooks - Midway Serverless diff --git a/packages/vite-lit-starter/.gitignore b/packages/vite-lit-starter/.gitignore new file mode 100644 index 0000000..a547bf3 --- /dev/null +++ b/packages/vite-lit-starter/.gitignore @@ -0,0 +1,24 @@ +# Logs +logs +*.log +npm-debug.log* +yarn-debug.log* +yarn-error.log* +pnpm-debug.log* +lerna-debug.log* + +node_modules +dist +dist-ssr +*.local + +# Editor directories and files +.vscode/* +!.vscode/extensions.json +.idea +.DS_Store +*.suo +*.ntvs* +*.njsproj +*.sln +*.sw? diff --git a/packages/vite-lit-starter/index.html b/packages/vite-lit-starter/index.html new file mode 100644 index 0000000..d8846e9 --- /dev/null +++ b/packages/vite-lit-starter/index.html @@ -0,0 +1,15 @@ + + + + + + + Vite + Lit App + + + + +

This is child content

+ + + diff --git a/packages/vite-lit-starter/package.json b/packages/vite-lit-starter/package.json new file mode 100644 index 0000000..21c9146 --- /dev/null +++ b/packages/vite-lit-starter/package.json @@ -0,0 +1,25 @@ +{ + "name": "vite-lit-starter", + "private": true, + "version": "0.0.0", + "main": "dist/my-element.es.js", + "exports": { + ".": "./dist/my-element.es.js" + }, + "types": "types/my-element.d.ts", + "files": [ + "dist", + "types" + ], + "scripts": { + "dev": "vite", + "build": "tsc && vite build" + }, + "dependencies": { + "lit": "^2.0.2" + }, + "devDependencies": { + "vite": "^2.8.0", + "typescript": "^4.5.4" + } +} \ No newline at end of file diff --git a/packages/vite-lit-starter/src/favicon.svg b/packages/vite-lit-starter/src/favicon.svg new file mode 100644 index 0000000..de4aedd --- /dev/null +++ b/packages/vite-lit-starter/src/favicon.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + + diff --git a/packages/vite-lit-starter/src/my-element.ts b/packages/vite-lit-starter/src/my-element.ts new file mode 100644 index 0000000..53d571a --- /dev/null +++ b/packages/vite-lit-starter/src/my-element.ts @@ -0,0 +1,58 @@ +import { html, css, LitElement } from 'lit'; +import { customElement, property } from 'lit/decorators.js'; + +/** + * An example element. + * + * @slot - This element has a slot + * @csspart button - The button + */ +@customElement('my-element') +export class MyElement extends LitElement { + static styles = css` + :host { + display: block; + border: solid 1px gray; + padding: 16px; + max-width: 800px; + } + `; + + /** + * The name to say "Hello" to. + */ + @property() + name = 'World'; + + /** + * The number of times the button has been clicked. + */ + @property({ type: Number }) + count = 0; + + render() { + return html` +

LinbuduLab Vite + Lit Starter

+ +

Hello, ${this.name}!

+ + + `; + } + + private _onClick() { + this.count++; + } + + foo(): string { + return 'foo'; + } +} + +declare global { + interface HTMLElementTagNameMap { + 'my-element': MyElement; + } +} diff --git a/packages/vite-lit-starter/src/vite-env.d.ts b/packages/vite-lit-starter/src/vite-env.d.ts new file mode 100644 index 0000000..11f02fe --- /dev/null +++ b/packages/vite-lit-starter/src/vite-env.d.ts @@ -0,0 +1 @@ +/// diff --git a/packages/vite-lit-starter/tsconfig.json b/packages/vite-lit-starter/tsconfig.json new file mode 100644 index 0000000..03ecaf4 --- /dev/null +++ b/packages/vite-lit-starter/tsconfig.json @@ -0,0 +1,21 @@ +{ + "compilerOptions": { + "module": "esnext", + "lib": ["es2017", "dom", "dom.iterable"], + "declaration": true, + "emitDeclarationOnly": true, + "outDir": "./types", + "strict": true, + "noUnusedLocals": true, + "noUnusedParameters": true, + "noImplicitReturns": true, + "noFallthroughCasesInSwitch": true, + "moduleResolution": "node", + "allowSyntheticDefaultImports": true, + "experimentalDecorators": true, + "forceConsistentCasingInFileNames": true, + "useDefineForClassFields": false + }, + "include": ["src/**/*.ts"], + "references": [{ "path": "./tsconfig.node.json" }] +} diff --git a/packages/vite-lit-starter/tsconfig.node.json b/packages/vite-lit-starter/tsconfig.node.json new file mode 100644 index 0000000..e993792 --- /dev/null +++ b/packages/vite-lit-starter/tsconfig.node.json @@ -0,0 +1,8 @@ +{ + "compilerOptions": { + "composite": true, + "module": "esnext", + "moduleResolution": "node" + }, + "include": ["vite.config.ts"] +} diff --git a/packages/vite-lit-starter/vite.config.ts b/packages/vite-lit-starter/vite.config.ts new file mode 100644 index 0000000..14639f4 --- /dev/null +++ b/packages/vite-lit-starter/vite.config.ts @@ -0,0 +1,14 @@ +import { defineConfig } from 'vite' + +// https://vitejs.dev/config/ +export default defineConfig({ + build: { + lib: { + entry: 'src/my-element.ts', + formats: ['es'] + }, + rollupOptions: { + external: /^lit/ + } + } +}) diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 3448c22..01943aa 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -829,6 +829,17 @@ importers: devDependencies: tsd: 0.19.1 + packages/vite-lit-starter: + specifiers: + lit: ^2.0.2 + typescript: ^4.5.4 + vite: ^2.8.0 + dependencies: + lit: 2.2.1 + devDependencies: + typescript: 4.6.2 + vite: 2.8.6 + packages/vite-plugin-starter: specifiers: vite: ^2.7.2 @@ -1951,21 +1962,6 @@ packages: dependencies: '@babel/types': 7.17.0 - /@babel/helper-module-transforms/7.17.6: - resolution: {integrity: sha512-2ULmRdqoOMpdvkbT8jONrZML/XALfzxlb052bldftkicAUy8AxSCkD5trDPQcwHNmolcl7wP6ehNqMlyUw6AaA==} - engines: {node: '>=6.9.0'} - dependencies: - '@babel/helper-environment-visitor': 7.16.7 - '@babel/helper-module-imports': 7.16.7 - '@babel/helper-simple-access': 7.17.7 - '@babel/helper-split-export-declaration': 7.16.7 - '@babel/helper-validator-identifier': 7.16.7 - '@babel/template': 7.16.7 - '@babel/traverse': 7.17.3 - '@babel/types': 7.17.0 - transitivePeerDependencies: - - supports-color - /@babel/helper-module-transforms/7.17.7: resolution: {integrity: sha512-VmZD99F3gNTYB7fJRDTi+u6l/zxY0BE6OIxPSU7a50s6ZUQkHwSDmV92FfM+oCG0pZRVojGYhkR8I0OGeCVREw==} engines: {node: '>=6.9.0'} @@ -3722,7 +3718,7 @@ packages: peerDependencies: '@babel/core': ^7.0.0-0 dependencies: - '@babel/helper-module-transforms': 7.17.6 + '@babel/helper-module-transforms': 7.17.7 '@babel/helper-plugin-utils': 7.16.7 babel-plugin-dynamic-import-node: 2.3.3 transitivePeerDependencies: @@ -3736,7 +3732,7 @@ packages: '@babel/core': ^7.0.0-0 dependencies: '@babel/core': 7.16.7 - '@babel/helper-module-transforms': 7.17.6 + '@babel/helper-module-transforms': 7.17.7 '@babel/helper-plugin-utils': 7.16.7 babel-plugin-dynamic-import-node: 2.3.3 transitivePeerDependencies: @@ -3750,7 +3746,7 @@ packages: '@babel/core': ^7.0.0-0 dependencies: '@babel/core': 7.17.5 - '@babel/helper-module-transforms': 7.17.6 + '@babel/helper-module-transforms': 7.17.7 '@babel/helper-plugin-utils': 7.16.7 babel-plugin-dynamic-import-node: 2.3.3 transitivePeerDependencies: @@ -3821,7 +3817,7 @@ packages: '@babel/core': ^7.0.0-0 dependencies: '@babel/helper-hoist-variables': 7.16.7 - '@babel/helper-module-transforms': 7.17.6 + '@babel/helper-module-transforms': 7.17.7 '@babel/helper-plugin-utils': 7.16.7 '@babel/helper-validator-identifier': 7.16.7 babel-plugin-dynamic-import-node: 2.3.3 @@ -3837,7 +3833,7 @@ packages: dependencies: '@babel/core': 7.16.7 '@babel/helper-hoist-variables': 7.16.7 - '@babel/helper-module-transforms': 7.17.6 + '@babel/helper-module-transforms': 7.17.7 '@babel/helper-plugin-utils': 7.16.7 '@babel/helper-validator-identifier': 7.16.7 babel-plugin-dynamic-import-node: 2.3.3 @@ -3853,7 +3849,7 @@ packages: dependencies: '@babel/core': 7.17.5 '@babel/helper-hoist-variables': 7.16.7 - '@babel/helper-module-transforms': 7.17.6 + '@babel/helper-module-transforms': 7.17.7 '@babel/helper-plugin-utils': 7.16.7 '@babel/helper-validator-identifier': 7.16.7 babel-plugin-dynamic-import-node: 2.3.3 @@ -3866,7 +3862,7 @@ packages: peerDependencies: '@babel/core': ^7.0.0-0 dependencies: - '@babel/helper-module-transforms': 7.17.6 + '@babel/helper-module-transforms': 7.17.7 '@babel/helper-plugin-utils': 7.16.7 transitivePeerDependencies: - supports-color @@ -3879,7 +3875,7 @@ packages: '@babel/core': ^7.0.0-0 dependencies: '@babel/core': 7.16.7 - '@babel/helper-module-transforms': 7.17.6 + '@babel/helper-module-transforms': 7.17.7 '@babel/helper-plugin-utils': 7.16.7 transitivePeerDependencies: - supports-color @@ -3892,7 +3888,7 @@ packages: '@babel/core': ^7.0.0-0 dependencies: '@babel/core': 7.17.5 - '@babel/helper-module-transforms': 7.17.6 + '@babel/helper-module-transforms': 7.17.7 '@babel/helper-plugin-utils': 7.16.7 transitivePeerDependencies: - supports-color @@ -21694,6 +21690,7 @@ packages: setprototypeof: 1.2.0 statuses: 1.5.0 toidentifier: 1.0.0 + dev: false /http-errors/1.8.1: resolution: {integrity: sha512-Kpk9Sm7NmI+RHhnj6OIWDI1d6fIoFAtFt9RLaTMRlg/8w49juAStsrBgp0Dp4OdxdVbRIeKhtCUvoi/RuAhO4g==} @@ -24650,7 +24647,7 @@ packages: engines: {node: '>= 8'} dependencies: debug: 4.3.3 - http-errors: 1.8.0 + http-errors: 1.8.1 resolve-path: 1.4.0 transitivePeerDependencies: - supports-color @@ -31970,7 +31967,7 @@ packages: dependencies: hast-util-sanitize: 3.0.2 hast-util-to-html: 7.1.3 - mdast-util-to-hast: 10.0.1 + mdast-util-to-hast: 10.2.0 dev: true /remark-mdx/1.6.22: @@ -34906,6 +34903,7 @@ packages: /toidentifier/1.0.0: resolution: {integrity: sha512-yaOH/Pk/VEhBWWTlhI+qXxDFXlejDGcQipMlyxda9nthulaxLZUNcUqFxokp0vcYnvteJln5FNQDRrxj3YcbVw==} engines: {node: '>=0.6'} + dev: false /toidentifier/1.0.1: resolution: {integrity: sha512-o5sSPKEkg/DIQNmH43V0/uerLrpzVedkUh8tGNvaeXpfpuwjKenlSox/2O/BTlZUtEe+JG7s5YhEz608PlAHRA==}