chore: 删除 ttf 字体相关

This commit is contained in:
pipipi-pikachu 2022-12-02 10:35:09 +08:00
parent 8992551f7d
commit 757b38c0d6
16 changed files with 19 additions and 32 deletions

View File

@ -75,7 +75,6 @@
"stylelint": "^13.8.0", "stylelint": "^13.8.0",
"stylelint-config-standard": "^20.0.0", "stylelint-config-standard": "^20.0.0",
"stylelint-webpack-plugin": "^2.1.1", "stylelint-webpack-plugin": "^2.1.1",
"ttf2woff2": "^4.0.5",
"typescript": "^4.4.4" "typescript": "^4.4.4"
}, },
"husky": { "husky": {

View File

@ -1,59 +1,45 @@
// 自动获取 src\assets\fonts 路径下的字体文件列表,并替换相关的 SCSS 变量
/* eslint-disable no-console */
const fs = require('fs') const fs = require('fs')
const ttf2woff2 = require('ttf2woff2')
const path = require('path') const path = require('path')
const assetsPath = path.join(__dirname, '../src/assets') const assetsPath = path.join(__dirname, '../src/assets')
const scssVariablePath = path.join(assetsPath, 'styles/variable.scss') const fontVarPath = path.join(assetsPath, 'styles/font.scss')
const fontsPath = path.join(assetsPath, 'fonts') const fontsPath = path.join(assetsPath, 'fonts')
const scssFontListVar = '$fontList' const scssFontListVar = '$fontList'
// scss 文件中 $fontList 变量替换 const replaceSCSSVariable = (names) => {
const replaceSCSSFile = (names) => { fs.readFile(fontVarPath, 'utf-8', (errs, content) => {
fs.readFile(scssVariablePath, 'utf-8', (errs, content) => {
if (errs) { if (errs) {
console.error(errs) console.error(errs)
process.exit(1) process.exit(1)
} }
const reg = new RegExp(`(\\${scssFontListVar}:\\s*)(.*)(;.*)`, 'g') const reg = new RegExp(`(\\${scssFontListVar}:\\s*)(.*)(;.*)`, 'g')
const newContent = content.replace(reg, `$1${names}$3`) const newContent = content.replace(reg, `$1${names}$3`)
fs.writeFile(scssVariablePath, newContent, (errs) => { fs.writeFile(fontVarPath, newContent, errs => {
if (errs) { if (errs) {
console.error(errs) console.error(errs)
process.exit(1) process.exit(1)
} }
console.log('替换 SCSS 字体列表成功!') console.log('自动生成自定义字体列表完成')
}) })
}) })
} }
// ttf 转 woff2
fs.readdir(fontsPath, { withFileTypes: true }, (errs, files) => { fs.readdir(fontsPath, { withFileTypes: true }, (errs, files) => {
if (errs) { if (errs) {
console.error(errs) console.error(errs)
process.exit(1) process.exit(1)
} }
const fontList = [] const woff2Fonts = files.filter(({ name }) => name.endsWith('.woff2'))
files const fontList = woff2Fonts.map(({ name }) => name.replace('.woff2', ''))
.filter(({ name }) => name.endsWith('.ttf'))
.forEach(({ name }) => {
console.log(`${name} 正在转换为 woff2 格式...`)
const woff2FontExists = files.find((item) => item.name.endsWith('.woff2'))
const replacedName = name.replace('.ttf', '.woff2')
fontList.push(name.replace('.ttf', ''))
if (woff2FontExists) {
console.log(`${replacedName} 已存在,不再转换`)
return
}
const input = fs.readFileSync(path.join(fontsPath, name))
fs.writeFileSync(
path.join(fontsPath, replacedName),
ttf2woff2(input)
)
console.log(`${name} 转换 woff2 成功!`)
})
const names = fontList.reduce((result, name, i) => { const names = fontList.reduce((result, name, i) => {
if (i === 0) return `'${name}'` if (i === 0) return `'${name}'`
return `${result}, '${name}'` return `${result}, '${name}'`
}, '') }, '')
replaceSCSSFile(names) replaceSCSSVariable(names)
}) })

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@ -1,7 +1,9 @@
$fontList: '仓耳小丸子', '优设标题黑', '字制区喜脉体', '峰广明锐体', '得意黑', '摄图摩登小方体', '站酷快乐体', '素材集市康康体', '素材集市酷方体', '途牛类圆体', '锐字真言体';
@each $font in $fontList { @each $font in $fontList {
@font-face { @font-face {
font-display: swap; font-display: swap;
font-family: $font; font-family: $font;
src: url('../fonts/#{$font}.woff2') format('woff2'), url('../fonts/#{$font}.ttf') format('truetype'); src: url('../fonts/#{$font}.woff2') format('woff2');
} }
} }

View File

@ -10,5 +10,4 @@ $transitionDelay: .2s;
$transitionDelayFast: .1s; $transitionDelayFast: .1s;
$transitionDelaySlow: .3s; $transitionDelaySlow: .3s;
$borderRadius: 2px; $borderRadius: 2px;
$fontList: '仓耳小丸子', '优设标题黑', '字制区喜脉体', '峰广明锐体', '摄图摩登小方体', '站酷快乐体', '素材集市康康体', '素材集市酷方体', '途牛类圆体', '锐字真言体';

View File

@ -30,6 +30,7 @@ export const SYS_FONTS = [
] ]
export const WEB_FONTS = [ export const WEB_FONTS = [
{ label: '得意黑', value: '得意黑' },
{ label: '仓耳小丸子', value: '仓耳小丸子' }, { label: '仓耳小丸子', value: '仓耳小丸子' },
{ label: '优设标题黑', value: '优设标题黑' }, { label: '优设标题黑', value: '优设标题黑' },
{ label: '峰广明锐体', value: '峰广明锐体' }, { label: '峰广明锐体', value: '峰广明锐体' },