mirror of
https://github.com/2234839/web-font.git
synced 2025-04-06 05:25:44 +08:00
更新文档
This commit is contained in:
parent
6b896d768e
commit
cae3bad5a9
11
Dockerfile
Normal file
11
Dockerfile
Normal file
@ -0,0 +1,11 @@
|
||||
FROM scratch
|
||||
WORKDIR /home/
|
||||
COPY dist_backend/app.lrt /home/app.lrt
|
||||
COPY llrt2 /home/llrt
|
||||
COPY dist/ /home/dist/
|
||||
EXPOSE 80
|
||||
CMD ["/home/llrt", "/home/app.lrt"]
|
||||
|
||||
# docker tag web-font:latest llej0/web-font:latest
|
||||
# docker push llej0/web-font:latest
|
||||
# docker build -t llej0/web-font:latest .
|
94
README.md
94
README.md
@ -1,28 +1,90 @@
|
||||
## Usage
|
||||
# web font 字体裁剪工具
|
||||
|
||||
```bash
|
||||
$ npm install # or pnpm install or yarn install
|
||||
之前的版本请查看 master 分支,为了能使用 llrt ,我进行了重写,之后只维护此分支
|
||||
|
||||
## 起因
|
||||
|
||||
ui 需要展现一些特定的字体,但直接引入字体包又过大,于是想到了裁剪字体,一开始想的使用「字蛛」但他是针对静态网站的,而且实际他会多出许多英文的,估计是直接将源码中存在的文字都算进去了。
|
||||
后来又找到阿里的「webfont」 但他的字体有限,项目又不开源,所以自己写了这个
|
||||
|
||||
## 在线尝试
|
||||
|
||||
- [web font 在线站点](https://webfont.shenzilong.cn/)
|
||||
|
||||
## 目的与功能
|
||||
|
||||
1.裁剪字体包使其仅包含选中的字体
|
||||
|
||||
例如 如下图生成的字体包仅包含 「天地无极乾坤借法」
|
||||

|
||||
|
||||
<video src="./doc_img/功能演示.mkv" controls="controls" width:100% height:auto></video>
|
||||
|
||||
其体积自然十分之小
|
||||
|
||||

|
||||
|
||||
2.另外可以生成 css 直接复制可用,部署在公网便可永久访问
|
||||
|
||||
例如
|
||||
|
||||
```css
|
||||
@font-face {
|
||||
font-family: "QIJIC";
|
||||
src: url("http://127.0.0.1:3000/asset/font/1584680576469/令东齐伋复刻体.eot"); /* IE9 */
|
||||
src: url("http://127.0.0.1:3000/asset/font/1584680576469/令东齐伋复刻体.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
|
||||
url("http://127.0.0.1:3000/asset/font/1584680576469/令东齐伋复刻体.woff") format("woff"), /* chrome, firefox */
|
||||
url("http://127.0.0.1:3000/asset/font/1584680576469/令东齐伋复刻体.ttf") format("truetype"), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */
|
||||
url("http://127.0.0.1:3000/asset/font/1584680576469/令东齐伋复刻体.svg#QIJIC") format("svg"); /* iOS 4.1- */
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
}
|
||||
```
|
||||
|
||||
### Learn more on the [Solid Website](https://solidjs.com) and come chat with us on our [Discord](https://discord.com/invite/solidjs)
|
||||
3.将 ttf 的字体包放置在 ./asset/font_src/ 目录下自然可以检测到新的可用字体,无需重启服务
|
||||
|
||||
## Available Scripts
|
||||

|
||||
|
||||
In the project directory, you can run:
|
||||
4.提供 zip 的整体下载方案
|
||||
|
||||
### `npm run dev`
|
||||

|
||||
|
||||
Runs the app in the development mode.<br>
|
||||
Open [http://localhost:5173](http://localhost:5173) to view it in the browser.
|
||||
## 安装与使用
|
||||
|
||||
### `npm run build`
|
||||
### 使用docker安装
|
||||
|
||||
Builds the app for production to the `dist` folder.<br>
|
||||
It correctly bundles Solid in production mode and optimizes the build for the best performance.
|
||||
https://hub.docker.com/repository/docker/llej0/web-font
|
||||
很小的包体积
|
||||

|
||||
|
||||
The build is minified and the filenames include the hashes.<br>
|
||||
Your app is ready to be deployed!
|
||||
docker compoose.yml
|
||||
```yml
|
||||
version: 'latest'
|
||||
services:
|
||||
app:
|
||||
image: llej0/web-font:latest
|
||||
ports:
|
||||
- "8087:8087"
|
||||
volumes:
|
||||
- /home/zixu/code/webfont/font:/home/font
|
||||
```
|
||||
其中font目录替换成你的字体文件存放目录
|
||||
|
||||
## Deployment
|
||||
|
||||
Learn more about deploying your application with the [documentations](https://vitejs.dev/guide/static-deploy.html)
|
||||
### 使用node等运行时
|
||||
|
||||
pnpm install && pnpm build && pnpm build_backend && node ./dist_backend/
|
||||
|
||||
## 提供的服务
|
||||
|
||||
|
||||
|
||||
## 鸣谢
|
||||
|
||||
[字体天下](http://www.fonts.net.cn/commercial-free-32767/fonts-zh-1.html)
|
||||
|
||||
[fontmin](https://github.com/ecomfe/fontmin)
|
||||
|
||||
## License
|
||||
|
||||
MIT © [崮生](https://shenzilong.cn/关于/mit.html)
|
||||
|
@ -1,10 +1,9 @@
|
||||
import fs, { readFile } from "fs/promises";
|
||||
import * as path from "path";
|
||||
import fs from "fs/promises";
|
||||
import type { cMiddleware } from "./server/req_res";
|
||||
import { mimeTypes } from "./server/mime_type";
|
||||
import { cRouter, SimpleHttpServer } from "./server/server";
|
||||
import { fontSubset } from "./font_util/font";
|
||||
import { readFile, writeFile } from "fs/promises";
|
||||
import { mimeTypes } from "./server/mime_type";
|
||||
import type { cMiddleware } from "./server/req_res";
|
||||
import { SimpleHttpServer } from "./server/server";
|
||||
const ROOT_DIR = path.resolve("dist"); // 静态文件目录
|
||||
const staticFileMiddleware: cMiddleware = async function (req, res, next) {
|
||||
if (req.method === "GET") {
|
||||
|
BIN
doc/image.png
Normal file
BIN
doc/image.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 94 KiB |
@ -6,6 +6,8 @@
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "tsc -b && vite build",
|
||||
"build_backend": "tsup && ./llrt2 compile ./dist_backend/app.cjs ./dist_backend/app.lrt",
|
||||
"docker": "docker build -t web-font:latest .",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
|
@ -1,6 +1,6 @@
|
||||
@font-face {
|
||||
font-family: "CustomFont";
|
||||
src: url("http://localhost:8087/api.ttf?font=令东齐伋复刻体.ttf&text=令东齐伋复刻体问藏书房") format("truetype");
|
||||
src: url("/api.ttf?font=令东齐伋复刻体.ttf&text=令东齐伋复刻体问藏书房") format("truetype");
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
@ -4,4 +4,7 @@ import { } from "fs";
|
||||
|
||||
export default defineConfig({
|
||||
plugins: [solid()],
|
||||
server:{
|
||||
host:"0.0.0.0"
|
||||
}
|
||||
})
|
||||
|
Loading…
x
Reference in New Issue
Block a user