I have kickstarted the project in Vite using Lit & TypeScript template.
It has automatically created an HTML and css files.
My aim is to create an app.ts file that dynamically injcets Lit Custom components once downloaded (my project is a third party plugin that is being loaded via script tag from the CDN).
When delete the HTML file and I run the build script that is tsc && vite build I get the following error:
RollupError: Could not resolve entry module "index.html".
Why do I need the html file for Lit project? If it's optional how can I bundle so that I only get bundeled js?
I have deleted the HTML file expecting it would just simply not bundle it but I am getting an error.
Use the library mode of Vite and set the entry point to a js/ts file.
e.g.
import { resolve } from 'path'
import { defineConfig } from 'vite'
export default defineConfig({
build: {
lib: {
// Could also be a dictionary or array of multiple entry points
entry: resolve(__dirname, 'lib/index.js'),
name: 'MyLib',
// the proper extensions will be added
fileName: 'my-lib',
},
rollupOptions: {
// make sure to externalize deps that shouldn't be bundled
// into your library
external: ['lit'],
},
},
})
Keeping the HTML file may still be useful in previewing your components during development.