Gathering detailed insights and metrics for vite-plugin-html-env
Gathering detailed insights and metrics for vite-plugin-html-env
Installations
npm install vite-plugin-html-envDeveloper Guide
BETA
Typescript
Yes
Module System
CommonJS
Min. Node Version
>=12.0.0
Node Version
16.15.1
NPM Version
8.11.0
Releases
Unable to fetch releases
Languages
2
JavaScript
TypeScript
JavaScript (99.6%)
TypeScript (0.4%)
Developer
lxs24sxl
Download Statistics
Total Downloads
0
Last Day
0
Last Week
0
Last Month
0
Last Year
0
GitHub Statistics
83 Stars
59 Commits
10 Forks
1 Watchers
2 Branches
6 Contributors
Updated on Feb 25, 2025
Maintainers
1
Package Meta Information
Latest Version
1.2.8
Package Id
vite-plugin-html-env@1.2.8
Unpacked Size
44.75 kB
Size
9.73 kB
File Count
9
NPM Version
8.11.0
Node Version
16.15.1
Published on
May 18, 2023
Total Downloads
Cumulative downloads
Total Downloads
NaN
Last Day
0%
NaN
Compared to previous day
Last Week
0%
NaN
Compared to previous week
Last Month
0%
NaN
Compared to previous month
Last Year
0%
NaN
Compared to previous year
Weekly Downloads
Monthly Downloads
Yearly Downloads
Peer Dependencies
1
Dev Dependencies
1
vite-plugin-html-env 
A Vite Plugin for rewriting html
English | 简体中文
Usage
1npm install --save-dev vite-plugin-html-env 2# or 3yarn add vite-plugin-html-env -D
1// vite.config.js 2import VitePluginHtmlEnv from 'vite-plugin-html-env' 3 4export default { 5 plugins: [ 6 VitePluginHtmlEnv(), 7 // or 8 // VitePluginHtmlEnv({ 9 // CUSTOM_FIELD 10 // }) 11 12 // Customizable prefixes and suffixes 13 // VitePluginHtmlEnv({ 14 // prefix: '<{', 15 // suffix: '}>', 16 // envPrefixes: ['VITE_', 'CUSTOME_PREFIX_'] 17 // }) 18 19 // Enable new compile mode by default 20 // 1. add directives => vite-if, vite-else 21 // 2. Compatible with `import.meta.env.VITE_APP__****` 22 // If there are compatibility issues with the new version, please raise the `issue` or submit a `merge request`, I will deal with it promptly in my personal free time. 23 VitePluginHtmlEnv({ 24 compiler: true 25 // compiler: false // old 26 }) 27 ] 28}
It is recommended to use VITE_APP_ as the key prefix.
# .env
VITE_APP_TITLE=测试标题
VITE_APP_HOST=dev.sever****.com
# .env.build-prod
VITE_APP_TITLE=生产标题
VITE_APP_HOST=prod.sever.****.com
1{ 2 "scripts": { 3 "start": "vite", 4 "build": "tsc && vite build", 5 "build:prod": "tsc && vite build --mode build-prod", 6 } 7}
By default, the local environment reads the .env file.Read the corresponding .env.*** file, when you configure the --mode command.Vite configuration instructions for .env files Env Variables and Modes
1<!DOCTYPE html> 2<html lang="en"> 3 <head> 4 <meta charset="UTF-8" /> 5 <!-- Version 1.0.4 uses prefix = <{ and suffix = }> by default --> 6 <!-- but is also compatible with older versions of prefixes and suffixes --> 7 8 <!-- <script src="//<% VITE_APP_HOST />/***.js"></script> --> 9 <!-- <title><% VITE_APP_TITLE /></title> --> 10 11 <script src="//<{ VITE_APP_HOST }>/***.js"></script> 12 <link rel="stylesheet" href="//<{ VITE_APP_HOST }>/test.css" /> 13 <title><{ VITE_APP_TITLE }></title> 14 15 <!-- compiler: true --> 16 <!-- Example 1 --> 17 <!-- VITE_APP_ENV = dev --> 18 <script vite-if="import.meta.env.VITE_APP_ENV === dev"> 19 console.log('vite-if') 20 </script> 21 <script vite-else>console.log('vite-else')</script> 22 23 <!-- Example 2 --> 24 <script vite-if="<{ VITE_APP_ENV }> !== dev"> 25 console.log('vite-if') 26 </script> 27 <script vite-else> 28 console.log('vite-else') 29 </script> 30 31 <!-- Example 3 --> 32 <!-- VITE_APP_NUM_9 = 9 --> 33 <script vite-if="import.meta.env.VITE_APP_NUM_9 < 10"> 34 console.log('9 < 10') 35 </script> 36 </head> 37 38 <body> 39 <div id="root"></div> 40 <script type="module" src="/src/main.tsx"></script> 41 </body> 42</html>
Options
prefix
- Type:
string - Default:
'<{'
suffix
- Type:
string - Default:
'}>'
envPrefixes
Set the prefixes attribute of the loadEnv method in dev mode, vite uses VITE_ as the prefix of environment variables by default.
- Type:
string | string[] - Default:
VITE_
compiler
- Type:
boolean - Default:
true
The new version of the plugin is enabled by default, and the template compilation mode is added, which contains new directives vite-if and vite-else, new parsing rules import.meta.env.VITE_APP_***.
enforce
- Type:
string - Default:
null
The value of enforce can be either "pre" or "post". plugin-ordering
compress
- Type:
boolean - Default:
false
Simple compression: remove spaces and line breaks
No vulnerabilities found.
Reason
no binaries found in the repo
Reason
0 existing vulnerabilities detected
Reason
Found 3/27 approved changesets -- score normalized to 1
Reason
0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
security policy file not detected
Details
- Warn: no security policy file detected
- Warn: no security file to analyze
- Warn: no security file to analyze
- Warn: no security file to analyze
Reason
project is not fuzzed
Details
- Warn: no fuzzer integrations found
Reason
license file not detected
Details
- Warn: project does not have a license file
Reason
branch protection not enabled on development/release branches
Details
- Warn: branch protection not enabled for branch 'master'
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
- Warn: 0 commits out of 6 are checked with a SAST tool
Score
2.7
/10
Last Scanned on 2025-07-07
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More