npmpackage.info

Gathering detailed insights and metrics for @xaios/vite-plugin-multiple-pages

@xaios/vite-plugin-multiple-pages - 0.0.5 | npmpackage.info

@xaios/vite-plugin-multiple-pages

Vite3 多页面入口自动管理

0.0.5

JavaScript

4.77 kB

Installations

npm install @xaios/vite-plugin-multiple-pages

Developer Guide

BETA

Typescript

No

Module System

CommonJS

Node Version

16.16.0

NPM Version

8.19.1 Pull Requests

Open

0

Total

0

Closed

0

Issues

Open

0

Total

0

Closed

0

Releases

Unable to fetch releases

Languages

JavaScript

HTML

JavaScript (84%)

HTML (16%)

Developer

xaios

Download Statistics

Total Downloads

Last Day

Last Week

Last Month

Last Year

GitHub Statistics

1 Stars

6 Commits

1 Watchers

1 Branches

1 Contributors

Updated on May 05, 2023

Maintainers

View All 1 Contributors

Package Meta Information

Latest Version

0.0.5

Package Id

@xaios/vite-plugin-multiple-pages@0.0.5

Unpacked Size

4.77 kB

Size

2.29 kB

File Count

NPM Version

8.19.1

Node Version

16.16.0

Total Downloads

Cumulative downloads

Total Downloads

NaN

Last Day

NaN

Compared to previous day

Last Week

NaN

Compared to previous week

Last Month

NaN

Compared to previous month

Last Year

NaN

Compared to previous year

Weekly Downloads

Monthly Downloads

Yearly Downloads

No dependencies detected.

vite.config.js 配置

1import MultiplePages from '@xaios/vite-plugin-multiple-pages'
2
3const CONFIG = {
4  // html: 'index.html',   // 自定义全局页面模板路径，路径相对此文件，可以不传，格式参考请看下文
5  // icon: 'favicon.ico',  // 自定义全局页面图标，值直接填入，默认值为空
6  list: [{
7    // html: '',           // 自定义私有页面模板路径，一般不需要配置
8    // icon: '',           // 自定义私有页面图标，一般不需要配置
9    name: 'main',          // 页面名称，将根据此配置寻找入口与生成页面
10    title: 'main',         // 页面标题，为空则取 name 值，也可以在代码中通过 document.title 动态更新
11    // entry: 'index.js'   // 自定义页面入口文件，值直接填入，默认填充规则为：`/src/pages/${name}/index.js`
12  }]
13}
14
15// 也可以直接作为数组传入，此时视为直接传入 list 的内容
16// const CONFIG = [{ name: 'main', title: 'main' }]
17
18export default {
19  plugins: [MultiplePages(CONFIG)]
20}

HTML 模板示例

1<!DOCTYPE HTML>
2<html>
3  <head>
4    <meta charset='utf-8'>
5    <meta name='viewport' content='width=device-width, initial-scale=1.0'>
6    <link type='image/x-icon' rel='shortcut icon' href='<%= ICON %>'>
7    <title><%= TITLE %></title>
8  </head>
9
10  <body>
11    <div id='app'></div>
12  </body>
13
14  <script type='module' src='<%= SRC %>'></script>
15</html>

开发目录要求

src
- pages
  - main
    - index.js，默认根据传入的配置读取对应目录下的 index.js 作为入口
  - user
    - index.js
template，临时入口模板目录，程序会自动覆盖此目录，需要注意
vite.config.js

环境要求

Vite3 必须使用 Node.js 14.18+ 或 16+ 的版本，15 及更旧的版本已不被支持，会无法安装。

插件基于 Vite3 + Node.js 16.16.0 开发，所以建议的使用环境也是这样，能确保正常运行，更新的版本可能会在后续兼容。

如果开发环境不允许更新全局 Node.js 版本，可以在项目中安装 Node.js 以实现指定版本运行项目：npm i node@16.16.0。

本插件使用了 Vite3 特有的插件钩子。

No vulnerabilities found.

No security vulnerabilities found.