diff --git a/dev/index.html b/dev/index.html
index 8ecd73c6..c97034ea 100644
--- a/dev/index.html
+++ b/dev/index.html
@@ -4,9 +4,7 @@
<head>
<meta charset="utf-8" />
<title><my-element> Demo</title>
- <script src="../node_modules/@webcomponents/webcomponentsjs/webcomponents-loader.js"></script>
- <script src="../node_modules/lit/polyfill-support.js"></script>
- <script type="module" src="../my-element.js"></script>
+ <script type="module" src="../src/my-element.ts"></script>
<style>
p {
border: solid 1px blue;
diff --git a/package.json b/package.json
index e824f55e..0113a9ec 100644
--- a/package.json
+++ b/package.json
@@ -53,6 +53,7 @@
"@typescript-eslint/eslint-plugin": "^5.25.0",
"@typescript-eslint/parser": "^5.25.0",
"@web/dev-server": "^0.1.31",
+ "@web/dev-server-esbuild": "^0.3.4",
"@web/dev-server-legacy": "^1.0.0",
"@web/test-runner": "^0.15.0",
"@web/test-runner-playwright": "^0.9.0",
diff --git a/web-dev-server.config.js b/web-dev-server.config.js
index 0c0fd21a..0ab17fe8 100644
--- a/web-dev-server.config.js
+++ b/web-dev-server.config.js
@@ -5,6 +5,7 @@
*/
import {legacyPlugin} from '@web/dev-server-legacy';
+import { esbuildPlugin } from '@web/dev-server-esbuild';
const mode = process.env.MODE || 'dev';
if (!['dev', 'prod'].includes(mode)) {
@@ -15,6 +16,15 @@ export default {
nodeResolve: {exportConditions: mode === 'dev' ? ['development'] : []},
preserveSymlinks: true,
plugins: [
+ esbuildPlugin({
+ js: true,
+ jsx: true,
+ ts: true,
+ tsx: true,
+ jsxFactory: 'React.createElement',
+ jsxFragment: 'Fragment',
+ target: 'es2020',
+ }),
legacyPlugin({
polyfills: {
// Manually imported in index.html file
diff --git a/web-test-runner.config.js b/web-test-runner.config.js
index 09d67918..d2549bb4 100644
--- a/web-test-runner.config.js
+++ b/web-test-runner.config.js
@@ -4,7 +4,8 @@
* SPDX-License-Identifier: BSD-3-Clause
*/
-import {legacyPlugin} from '@web/dev-server-legacy';
+import { legacyPlugin } from '@web/dev-server-legacy';
+import { esbuildPlugin } from '@web/dev-server-esbuild';
import {playwrightLauncher} from '@web/test-runner-playwright';
const mode = process.env.MODE || 'dev';
@@ -91,7 +92,7 @@ try {
// https://modern-web.dev/docs/test-runner/cli-and-configuration/
export default {
rootDir: '.',
- files: ['./test/**/*_test.js'],
+ files: ['./src/test/**/*_test.ts'],
nodeResolve: {exportConditions: mode === 'dev' ? ['development'] : []},
preserveSymlinks: true,
browsers: commandLineBrowsers ?? Object.values(browsers),
@@ -120,5 +121,9 @@ export default {
],
},
}),
+ esbuildPlugin({
+ ts: true,
+ target: 'es2020',
+ }),
],
};