diff --git a/package.json b/package.json index b89edb15..5163fc52 100644 --- a/package.json +++ b/package.json @@ -75,7 +75,6 @@ "stylelint": "^13.8.0", "stylelint-config-standard": "^20.0.0", "stylelint-webpack-plugin": "^2.1.1", - "ttf2woff2": "^4.0.5", "typescript": "^4.4.4" }, "husky": { diff --git a/scripts/build-fonts.js b/scripts/build-fonts.js index 9fa96477..cd67989a 100644 --- a/scripts/build-fonts.js +++ b/scripts/build-fonts.js @@ -1,59 +1,45 @@ +// 自动获取 src\assets\fonts 路径下的字体文件列表，并替换相关的 SCSS 变量 + +/* eslint-disable no-console */ + const fs = require('fs') -const ttf2woff2 = require('ttf2woff2') const path = require('path') + 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 scssFontListVar = '$fontList' -// scss 文件中 $fontList 变量替换 -const replaceSCSSFile = (names) => { - fs.readFile(scssVariablePath, 'utf-8', (errs, content) => { +const replaceSCSSVariable = (names) => { + fs.readFile(fontVarPath, 'utf-8', (errs, content) => { if (errs) { console.error(errs) process.exit(1) } const reg = new RegExp(`(\\${scssFontListVar}:\\s*)(.*)(;.*)`, 'g') const newContent = content.replace(reg, `$1${names}$3`) - fs.writeFile(scssVariablePath, newContent, (errs) => { + fs.writeFile(fontVarPath, newContent, errs => { if (errs) { console.error(errs) process.exit(1) } - console.log('替换 SCSS 字体列表成功！') + console.log('自动生成自定义字体列表完成') }) }) } -// ttf 转 woff2 fs.readdir(fontsPath, { withFileTypes: true }, (errs, files) => { if (errs) { console.error(errs) process.exit(1) } - const fontList = [] - files - .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 woff2Fonts = files.filter(({ name }) => name.endsWith('.woff2')) + const fontList = woff2Fonts.map(({ name }) => name.replace('.woff2', '')) - 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) => { if (i === 0) return `'${name}'` return `${result}, '${name}'` }, '') - replaceSCSSFile(names) + replaceSCSSVariable(names) }) diff --git a/src/assets/fonts/仓耳小丸子.ttf b/src/assets/fonts/仓耳小丸子.ttf deleted file mode 100644 index a8786a4d..00000000 Binary files a/src/assets/fonts/仓耳小丸子.ttf and /dev/null differ diff --git a/src/assets/fonts/优设标题黑.ttf b/src/assets/fonts/优设标题黑.ttf deleted file mode 100644 index 3729151a..00000000 Binary files a/src/assets/fonts/优设标题黑.ttf and /dev/null differ diff --git a/src/assets/fonts/字制区喜脉体.ttf b/src/assets/fonts/字制区喜脉体.ttf deleted file mode 100644 index d3528404..00000000 Binary files a/src/assets/fonts/字制区喜脉体.ttf and /dev/null differ diff --git a/src/assets/fonts/峰广明锐体.ttf b/src/assets/fonts/峰广明锐体.ttf deleted file mode 100644 index 0cd0e2d0..00000000 Binary files a/src/assets/fonts/峰广明锐体.ttf and /dev/null differ diff --git a/src/assets/fonts/得意黑.woff2 b/src/assets/fonts/得意黑.woff2 new file mode 100644 index 00000000..caf6caad Binary files /dev/null and b/src/assets/fonts/得意黑.woff2 differ diff --git a/src/assets/fonts/摄图摩登小方体.ttf b/src/assets/fonts/摄图摩登小方体.ttf deleted file mode 100644 index cde0e4c9..00000000 Binary files a/src/assets/fonts/摄图摩登小方体.ttf and /dev/null differ diff --git a/src/assets/fonts/站酷快乐体.ttf b/src/assets/fonts/站酷快乐体.ttf deleted file mode 100644 index ba2ad8a7..00000000 Binary files a/src/assets/fonts/站酷快乐体.ttf and /dev/null differ diff --git a/src/assets/fonts/素材集市康康体.ttf b/src/assets/fonts/素材集市康康体.ttf deleted file mode 100644 index 6adc515a..00000000 Binary files a/src/assets/fonts/素材集市康康体.ttf and /dev/null differ diff --git a/src/assets/fonts/素材集市酷方体.ttf b/src/assets/fonts/素材集市酷方体.ttf deleted file mode 100644 index b8d727cd..00000000 Binary files a/src/assets/fonts/素材集市酷方体.ttf and /dev/null differ diff --git a/src/assets/fonts/途牛类圆体.ttf b/src/assets/fonts/途牛类圆体.ttf deleted file mode 100644 index a411dd42..00000000 Binary files a/src/assets/fonts/途牛类圆体.ttf and /dev/null differ diff --git a/src/assets/fonts/锐字真言体.ttf b/src/assets/fonts/锐字真言体.ttf deleted file mode 100644 index 7c1e7de6..00000000 Binary files a/src/assets/fonts/锐字真言体.ttf and /dev/null differ diff --git a/src/assets/styles/font.scss b/src/assets/styles/font.scss index 4876af4f..a1846e50 100644 --- a/src/assets/styles/font.scss +++ b/src/assets/styles/font.scss @@ -1,7 +1,9 @@ +$fontList: '仓耳小丸子', '优设标题黑', '字制区喜脉体', '峰广明锐体', '得意黑', '摄图摩登小方体', '站酷快乐体', '素材集市康康体', '素材集市酷方体', '途牛类圆体', '锐字真言体'; + @each $font in $fontList { @font-face { font-display: swap; font-family: $font; - src: url('../fonts/#{$font}.woff2') format('woff2'), url('../fonts/#{$font}.ttf') format('truetype'); + src: url('../fonts/#{$font}.woff2') format('woff2'); } } \ No newline at end of file diff --git a/src/assets/styles/variable.scss b/src/assets/styles/variable.scss index 94da5110..ff714dbb 100644 --- a/src/assets/styles/variable.scss +++ b/src/assets/styles/variable.scss @@ -10,5 +10,4 @@ $transitionDelay: .2s; $transitionDelayFast: .1s; $transitionDelaySlow: .3s; -$borderRadius: 2px; -$fontList: '仓耳小丸子', '优设标题黑', '字制区喜脉体', '峰广明锐体', '摄图摩登小方体', '站酷快乐体', '素材集市康康体', '素材集市酷方体', '途牛类圆体', '锐字真言体'; \ No newline at end of file +$borderRadius: 2px; \ No newline at end of file diff --git a/src/configs/font.ts b/src/configs/font.ts index 2961b2e1..a8909ea8 100644 --- a/src/configs/font.ts +++ b/src/configs/font.ts @@ -30,6 +30,7 @@ export const SYS_FONTS = [ ] export const WEB_FONTS = [ + { label: '得意黑', value: '得意黑' }, { label: '仓耳小丸子', value: '仓耳小丸子' }, { label: '优设标题黑', value: '优设标题黑' }, { label: '峰广明锐体', value: '峰广明锐体' },