From 6db3d2df69bf95513615a2aa1dee28550ea077c1 Mon Sep 17 00:00:00 2001
From: Mostafa Shamsitabar <50550858+mimshins@users.noreply.github.com>
Date: Wed, 13 Nov 2024 11:04:32 +0330
Subject: [PATCH] refactor(infra): improve dev workspace and server and remove
redundant tools (#253)
---
.gitignore | 11 ++++-
index.html => dev/index.html | 29 +++++++------
dev/package.json | 14 +++++++
dev/public/vite.svg | 1 +
dev/src/index.css | 0
dev/src/index.ts | 2 +
dev/src/vite-env.d.ts | 1 +
dev/tsconfig.json | 11 +++++
dev/vite.config.ts | 6 +++
eslint.config.js | 5 ++-
package.json | 8 ++--
pnpm-lock.yaml | 81 ++++++++++++++++++++++++++++--------
pnpm-workspace.yaml | 1 +
web-dev-server.config.mjs | 9 ----
14 files changed, 135 insertions(+), 44 deletions(-)
rename index.html => dev/index.html (61%)
create mode 100644 dev/package.json
create mode 100644 dev/public/vite.svg
create mode 100644 dev/src/index.css
create mode 100644 dev/src/index.ts
create mode 100644 dev/src/vite-env.d.ts
create mode 100644 dev/tsconfig.json
create mode 100644 dev/vite.config.ts
delete mode 100644 web-dev-server.config.mjs
diff --git a/.gitignore b/.gitignore
index 139953dc..e893b39d 100644
--- a/.gitignore
+++ b/.gitignore
@@ -44,8 +44,15 @@ jspm_packages/
.pnp.*
## Editors
+.vscode/*
+!.vscode/extensions.json
.idea
-.vscode
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
## System files
.DS_Store
@@ -56,7 +63,9 @@ jspm_packages/
# Build output
_site
dist
+dist-ssr
out-tsc
+*.local
# Storybook
storybook-static
diff --git a/index.html b/dev/index.html
similarity index 61%
rename from index.html
rename to dev/index.html
index ea6c8869..b4de3db0 100644
--- a/index.html
+++ b/dev/index.html
@@ -2,6 +2,11 @@
+
+
+
+ Vite + Lit + TS
-
-
-
+
+ Vite + Lit
diff --git a/dev/package.json b/dev/package.json
new file mode 100644
index 00000000..3c89cd6f
--- /dev/null
+++ b/dev/package.json
@@ -0,0 +1,14 @@
+{
+ "name": "@tapsioss/dev",
+ "private": true,
+ "version": "0.0.0",
+ "type": "module",
+ "scripts": {
+ "dev": "vite",
+ "build": "tsc && vite build",
+ "preview": "vite preview"
+ },
+ "dependencies": {
+ "lit": "^3.2.1"
+ }
+}
diff --git a/dev/public/vite.svg b/dev/public/vite.svg
new file mode 100644
index 00000000..e7b8dfb1
--- /dev/null
+++ b/dev/public/vite.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/dev/src/index.css b/dev/src/index.css
new file mode 100644
index 00000000..e69de29b
diff --git a/dev/src/index.ts b/dev/src/index.ts
new file mode 100644
index 00000000..1adfe79d
--- /dev/null
+++ b/dev/src/index.ts
@@ -0,0 +1,2 @@
+// Import modules using path aliases
+// i.e. `import "@tapsioss/web-components/avatar";`
diff --git a/dev/src/vite-env.d.ts b/dev/src/vite-env.d.ts
new file mode 100644
index 00000000..11f02fe2
--- /dev/null
+++ b/dev/src/vite-env.d.ts
@@ -0,0 +1 @@
+///
diff --git a/dev/tsconfig.json b/dev/tsconfig.json
new file mode 100644
index 00000000..514edc53
--- /dev/null
+++ b/dev/tsconfig.json
@@ -0,0 +1,11 @@
+{
+ "extends": "../tsconfig.json",
+ "compilerOptions": {
+ "target": "ES2020",
+
+ "moduleResolution": "Bundler",
+ "allowImportingTsExtensions": true
+ },
+ "include": ["src"],
+ "exclude": ["node_modules", "dist"]
+}
diff --git a/dev/vite.config.ts b/dev/vite.config.ts
new file mode 100644
index 00000000..84963575
--- /dev/null
+++ b/dev/vite.config.ts
@@ -0,0 +1,6 @@
+import { defineConfig } from "vite";
+import tsconfigPaths from "vite-tsconfig-paths";
+
+export default defineConfig({
+ plugins: [tsconfigPaths()],
+});
diff --git a/eslint.config.js b/eslint.config.js
index 397c8ade..7347139b 100644
--- a/eslint.config.js
+++ b/eslint.config.js
@@ -23,7 +23,10 @@ export default config(
parserOptions: {
tsconfigRootDir: import.meta.dirname,
project: true,
- projectService: true,
+ projectService: {
+ defaultProject: "./tsconfig.json",
+ allowDefaultProject: ["dev/vite.config.ts"],
+ },
sourceType: "module",
},
},
diff --git a/package.json b/package.json
index 093e4787..816b1df2 100644
--- a/package.json
+++ b/package.json
@@ -19,8 +19,7 @@
"web-icons:release": "pnpm --filter @tapsioss/web-icons run release",
"react-icons:build": "pnpm --filter @tapsioss/react-icons run build",
"react-icons:release": "pnpm --filter @tapsioss/react-icons run release",
- "dev:transpile": "tsc --project tsconfig.dev.json --watch --preserveWatchOutput",
- "dev": "pnpm clear:dist && pnpm dev:transpile & wds",
+ "dev": "pnpm --filter @tapsioss/dev run dev",
"build:packages": "pnpm run -r --parallel build",
"release:packages": "pnpm run -r release",
"test": "pnpm run -r --parallel test",
@@ -55,8 +54,7 @@
"@types/react-dom": "^18.3.1",
"@types/semver": "^7.5.8",
"@types/sinon": "^17.0.3",
- "@web/dev-server": "^0.4.2",
- "@web/dev-server-esbuild": "^1.0.2",
+ "@web/dev-server-esbuild": "^1.0.3",
"@web/test-runner": "^0.18.0",
"cemnama": "0.0.0-alpha-5",
"custom-elements-manifest": "^2.1.0",
@@ -87,6 +85,8 @@
"tsx": "^4.19.2",
"typescript": "^5.6.2",
"typescript-eslint": "^8.8.1",
+ "vite": "^5.4.11",
+ "vite-tsconfig-paths": "^5.1.2",
"vitepress": "^1.1.4"
}
}
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 2b4d3c23..d07b0f26 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -22,7 +22,7 @@ importers:
version: 4.0.0
'@tapsioss/icons':
specifier: 0.0.0-alpha-8
- version: 0.0.0-alpha-8(typescript@5.6.3)(vite@5.4.10(@types/node@20.17.6))
+ version: 0.0.0-alpha-8(typescript@5.6.3)(vite@5.4.11(@types/node@20.17.6))
'@types/chai':
specifier: ^4.3.12
version: 4.3.20
@@ -53,11 +53,8 @@ importers:
'@types/sinon':
specifier: ^17.0.3
version: 17.0.3
- '@web/dev-server':
- specifier: ^0.4.2
- version: 0.4.6
'@web/dev-server-esbuild':
- specifier: ^1.0.2
+ specifier: ^1.0.3
version: 1.0.3
'@web/test-runner':
specifier: ^0.18.0
@@ -149,10 +146,22 @@ importers:
typescript-eslint:
specifier: ^8.8.1
version: 8.13.0(eslint@9.14.0)(typescript@5.6.3)
+ vite:
+ specifier: ^5.4.11
+ version: 5.4.11(@types/node@20.17.6)
+ vite-tsconfig-paths:
+ specifier: ^5.1.2
+ version: 5.1.2(typescript@5.6.3)(vite@5.4.11(@types/node@20.17.6))
vitepress:
specifier: ^1.1.4
version: 1.5.0(@algolia/client-search@5.13.0)(@types/node@20.17.6)(@types/react@18.3.12)(postcss@8.4.47)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(search-insights@2.17.2)(typescript@5.6.3)
+ dev:
+ dependencies:
+ lit:
+ specifier: ^3.2.1
+ version: 3.2.1
+
packages/icons: {}
packages/react-components: {}
@@ -2341,6 +2350,9 @@ packages:
resolution: {integrity: sha512-s3Fq41ZVh7vbbe2PN3nrW7yC7U7MFVc5c98/iTl9c2GawNMKx/J648KQRW6WKkuU8GIbbh2IXfIRQjOZnXcTnw==}
engines: {node: '>=18'}
+ globrex@0.1.2:
+ resolution: {integrity: sha512-uHJgbwAMwNFf5mLst7IWLNg14x1CkeqglJb/K3doi4dw6q2IvAAmM/Y81kevy83wP+Sst+nutFTYOGg3d1lsxg==}
+
gopd@1.0.1:
resolution: {integrity: sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA==}
@@ -3535,6 +3547,16 @@ packages:
peerDependencies:
typescript: '>=4.2.0'
+ tsconfck@3.1.4:
+ resolution: {integrity: sha512-kdqWFGVJqe+KGYvlSO9NIaWn9jT1Ny4oKVzAJsKii5eoE9snzTJzL4+MMVOMn+fikWGFmKEylcXL710V/kIPJQ==}
+ engines: {node: ^18 || >=20}
+ hasBin: true
+ peerDependencies:
+ typescript: ^5.0.0
+ peerDependenciesMeta:
+ typescript:
+ optional: true
+
tsconfig-paths@3.15.0:
resolution: {integrity: sha512-2Ac2RgzDe/cn48GvOe3M+o82pEFewD3UPbyoUHHdKasHwJKjds4fLXWf/Ux5kATBKN20oaFGu+jbElp1pos0mg==}
@@ -3685,8 +3707,16 @@ packages:
vfile@6.0.3:
resolution: {integrity: sha512-KzIbH/9tXat2u30jf+smMwFCsno4wHVdNmzFyL+T/L3UGqqk6JKfVqOFOZEpZSHADH1k40ab6NUIXZq422ov3Q==}
- vite@5.4.10:
- resolution: {integrity: sha512-1hvaPshuPUtxeQ0hsVH3Mud0ZanOLwVTneA1EgbAM5LhaZEqyPWGRQ7BtaMvUrTDeEaC8pxtj6a6jku3x4z6SQ==}
+ vite-tsconfig-paths@5.1.2:
+ resolution: {integrity: sha512-gEIbKfJzSEv0yR3XS2QEocKetONoWkbROj6hGx0FHM18qKUojhvcokQsxQx5nMkelZq2n37zbSGCJn+FSODSjA==}
+ peerDependencies:
+ vite: '*'
+ peerDependenciesMeta:
+ vite:
+ optional: true
+
+ vite@5.4.11:
+ resolution: {integrity: sha512-c7jFQRklXua0mTzneGW9QVyxFjUgwcihC4bXEtujIo2ouWCe1Ajt/amn2PCxYnhYfd5k09JX3SB7OYWFKYqj8Q==}
engines: {node: ^18.0.0 || >=20.0.0}
hasBin: true
peerDependencies:
@@ -4627,10 +4657,10 @@ snapshots:
'@sinonjs/text-encoding@0.7.3': {}
- '@tapsioss/icons@0.0.0-alpha-8(typescript@5.6.3)(vite@5.4.10(@types/node@20.17.6))':
+ '@tapsioss/icons@0.0.0-alpha-8(typescript@5.6.3)(vite@5.4.11(@types/node@20.17.6))':
dependencies:
- '@vitejs/plugin-react': 4.3.3(vite@5.4.10(@types/node@20.17.6))
- '@vitejs/plugin-vue': 5.1.4(vite@5.4.10(@types/node@20.17.6))(vue@3.5.12(typescript@5.6.3))
+ '@vitejs/plugin-react': 4.3.3(vite@5.4.11(@types/node@20.17.6))
+ '@vitejs/plugin-vue': 5.1.4(vite@5.4.11(@types/node@20.17.6))(vue@3.5.12(typescript@5.6.3))
ansi-colors: 4.1.3
lit: 3.2.1
vue: 3.5.12(typescript@5.6.3)
@@ -4935,20 +4965,20 @@ snapshots:
'@ungap/structured-clone@1.2.0': {}
- '@vitejs/plugin-react@4.3.3(vite@5.4.10(@types/node@20.17.6))':
+ '@vitejs/plugin-react@4.3.3(vite@5.4.11(@types/node@20.17.6))':
dependencies:
'@babel/core': 7.26.0
'@babel/plugin-transform-react-jsx-self': 7.25.9(@babel/core@7.26.0)
'@babel/plugin-transform-react-jsx-source': 7.25.9(@babel/core@7.26.0)
'@types/babel__core': 7.20.5
react-refresh: 0.14.2
- vite: 5.4.10(@types/node@20.17.6)
+ vite: 5.4.11(@types/node@20.17.6)
transitivePeerDependencies:
- supports-color
- '@vitejs/plugin-vue@5.1.4(vite@5.4.10(@types/node@20.17.6))(vue@3.5.12(typescript@5.6.3))':
+ '@vitejs/plugin-vue@5.1.4(vite@5.4.11(@types/node@20.17.6))(vue@3.5.12(typescript@5.6.3))':
dependencies:
- vite: 5.4.10(@types/node@20.17.6)
+ vite: 5.4.11(@types/node@20.17.6)
vue: 3.5.12(typescript@5.6.3)
'@vue/compiler-core@3.5.12':
@@ -6293,6 +6323,8 @@ snapshots:
slash: 5.1.0
unicorn-magic: 0.1.0
+ globrex@0.1.2: {}
+
gopd@1.0.1:
dependencies:
get-intrinsic: 1.2.4
@@ -7533,6 +7565,10 @@ snapshots:
dependencies:
typescript: 5.6.3
+ tsconfck@3.1.4(typescript@5.6.3):
+ optionalDependencies:
+ typescript: 5.6.3
+
tsconfig-paths@3.15.0:
dependencies:
'@types/json5': 0.0.29
@@ -7699,7 +7735,18 @@ snapshots:
'@types/unist': 3.0.3
vfile-message: 4.0.2
- vite@5.4.10(@types/node@20.17.6):
+ vite-tsconfig-paths@5.1.2(typescript@5.6.3)(vite@5.4.11(@types/node@20.17.6)):
+ dependencies:
+ debug: 4.3.7
+ globrex: 0.1.2
+ tsconfck: 3.1.4(typescript@5.6.3)
+ optionalDependencies:
+ vite: 5.4.11(@types/node@20.17.6)
+ transitivePeerDependencies:
+ - supports-color
+ - typescript
+
+ vite@5.4.11(@types/node@20.17.6):
dependencies:
esbuild: 0.21.5
postcss: 8.4.47
@@ -7717,7 +7764,7 @@ snapshots:
'@shikijs/transformers': 1.22.2
'@shikijs/types': 1.22.2
'@types/markdown-it': 14.1.2
- '@vitejs/plugin-vue': 5.1.4(vite@5.4.10(@types/node@20.17.6))(vue@3.5.12(typescript@5.6.3))
+ '@vitejs/plugin-vue': 5.1.4(vite@5.4.11(@types/node@20.17.6))(vue@3.5.12(typescript@5.6.3))
'@vue/devtools-api': 7.6.3
'@vue/shared': 3.5.12
'@vueuse/core': 11.2.0(vue@3.5.12(typescript@5.6.3))
@@ -7726,7 +7773,7 @@ snapshots:
mark.js: 8.11.1
minisearch: 7.1.0
shiki: 1.22.2
- vite: 5.4.10(@types/node@20.17.6)
+ vite: 5.4.11(@types/node@20.17.6)
vue: 3.5.12(typescript@5.6.3)
optionalDependencies:
postcss: 8.4.47
diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml
index 3ce6f3b7..840fc4be 100644
--- a/pnpm-workspace.yaml
+++ b/pnpm-workspace.yaml
@@ -1,3 +1,4 @@
packages:
# all packages in direct subdirs of packages/
- "packages/*"
+ - "dev"
diff --git a/web-dev-server.config.mjs b/web-dev-server.config.mjs
deleted file mode 100644
index caa5ea5b..00000000
--- a/web-dev-server.config.mjs
+++ /dev/null
@@ -1,9 +0,0 @@
-export default /** @type {import('@web/dev-server').DevServerConfig} */ ({
- open: true,
- watch: true,
- port: 3000,
- nodeResolve: {
- exportConditions: ["browser", "development"],
- },
- plugins: [],
-});