After much troubleshooting I decided to try to get the most basic of programs to run in lit, and have not have much luck. Here are my steps:
I installed lit into the same directory as my index.html and app.js using npm i lit. I generated my package.json using npm init and chose the default values.
Here is my index.html:
<!DOCTYPE html>
<head>
<script type="module" src="./app.js"></script>
</head>
<body>
<test-element></test-element>
</body>
</html>
Here is my app.js:
import {html, css, LitElement} from 'lit';
export class Test extends LitElement {
constructor() {
super();
}
render() {
return html`<p>Test</p>`;
}
}
customElements.define('test-element', Test);
Here is my package.json:
{
"name": "test",
"version": "1.0.0",
"description": "",
"main": "index.js",
"type": "module",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"dependencies": {
"lit": "^2.2.3"
}
}
What am I doing wrong here?
EDIT: Not sure why this was closed, but the issue was that I was using the built-in Live Server extension in VS Code. Running a web server directly with npm seemed to fix it. https://modern-web.dev/docs/dev-server/overview/