Awesome

Vite Manifest Parser

This library provides a simple way to parse a manifest.json file generated by Vite and render corresponding HTML code blocks for easy backend integration. It is particularly useful for projects where the frontend is managed by Vite and the backend requires integration of the generated assets.

Features

Parses manifest.json to generate HTML script and link tags.
Supports both development and production environments.
Handles legacy browser scripts and polyfill loading.

Installation

To install vite-manifest-parser, run the following command:

npm install vite-manifest-parser --save

Usage

To use the parser, you need to import the parser function from the package and call it with the appropriate parameters.

import { parser } from 'vite-manifest-parser';

const input = 'src/app/main.ts'; // Your entry file
const outDir = '/absolute/path/to/dist'; // Your build directory
const publicPath = '/public/dist/'; // Public path to your assets
const isDev = process.env.NODE_ENV !== 'production'; // Determine the environment

const { preload, css, js } = await parser({ input, outDir, publicPath, isDev });

For template usage, such as rendering with EJS templates.

<!DOCTYPE html>
<html>
  <head>
    <title>vite-manifest-parser</title>
    <%-preload%>
    <%-css%>
  </head>
  <body>
    <div id="app"></div>
    <%-js%>
  </body>
</html>

API

parser(options)

options.input - The entry file, which is the relative path in the client project (the key value in the manifest.json).
options.outDir - The build directory, please use an absolute path.
options.publicPath - The resource path, such as /public/dist/ or https://static.example.com/. The default value is '/'.
options.isDev - Indicates whether it is a development environment. If true, it will not parse manifest.json and will use Vite's development server.

Development

To contribute to the library or run it locally for development, you will need to clone the repository and install its dependencies.

git clone https://github.com/your-username/vite-manifest-parser.git
cd vite-manifest-parser
pnpm install

Make sure to write tests for new features or bug fixes and run the tests to ensure everything is working correctly.

npm test

License

This project is licensed under the MIT License - see the LICENSE file for details.