Create a project with HTML components.
Pre-alpha!
npx @htmlcomponents/create
Installs Vite and postCSS.
cd path/to/new/project
npm run dev
# or
npm run build
npm run preview
Copy /public/import and /public/assets to the root directory of new project.
In VS Code, use an extension like Live Server.
Right-click index.html at root of new project and select "Open with Live Server.
If using Live Server, be sure that your new project is at the top level of the current VS Code workspace, not in a subfolder of the workspace.
Vite-html-import-plugin transforms HTML by removing and replacing custom elements whose source files are in the public directory.
Without this plugin, html-import will import its content at run time.
vite.config.js:
import { defineConfig } from "vite";
import viteHTMLImportPlugin from "./components/imports/viteHTMLImportPlugin/viteHTMLImportPlugin";
export default defineConfig({
plugins: [viteHTMLImportPlugin()],
});