1
0
mirror of https://github.com/akveo/eva-icons.git synced 2025-08-31 17:42:11 +02:00

fix(builder): fix web fonts building (#27)

Closes #26
This commit is contained in:
Denis Strigo
2018-11-12 15:40:17 +02:00
committed by Dmitry Nehaychik
parent cc48a6bc81
commit d907505e06
7 changed files with 3044 additions and 2979 deletions

5905
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@@ -65,6 +65,7 @@
"cross-env": "^5.2.0",
"css-loader": "^1.0.0",
"fs-extra": "^7.0.0",
"globby": "^8.0.1",
"gm": "^1.23.1",
"html-minifier": "^3.5.20",
"jasmine-core": "~2.99.1",

View File

@@ -9,16 +9,19 @@ const path = require('path');
const fs = require('fs-extra');
const processScss = require('./process-scss');
const prepareSVGsForFonts = require('./web-font-process-svgs');
const config = require('../config');
const fileSystemHelper = require('../helpers/fs-helper');
const webFontOptions = {
files: path.resolve(config.srcPath, '**/*.svg'),
files: path.resolve(config.desPath, '**/icons/svg/*.svg'),
fontName: 'Eva-Icons',
template: 'css',
templateFontName: 'Eva-Icons',
templateClassName: 'eva',
templateFontPath: './fonts'
templateFontPath: './fonts',
normalize: true,
fontHeight: 600,
};
const buildFont = () => {
@@ -27,33 +30,37 @@ const buildFont = () => {
fileSystemHelper.mkDirByPathSync(dest);
return webfont(webFontOptions)
.then((result) => {
const { fontName, template } = result.config;
return prepareSVGsForFonts()
.then(() => {
return webfont(webFontOptions)
.then((result) => {
const { fontName, template } = result.config;
return Promise.all(
Object.keys(result).map(type => {
if (
type === 'config' ||
type === 'usedBuildInTemplate' ||
type === 'glyphsData'
) {
return Promise.resolve();
}
return Promise.all(
Object.keys(result).map(type => {
if (
type === 'config' ||
type === 'usedBuildInTemplate' ||
type === 'glyphsData'
) {
return Promise.resolve();
}
const content = result[type];
let file = null;
const content = result[type];
let file = null;
if (type !== 'template') {
file = path.resolve(dest, `${fontName}.${type}`);
} else {
file = path.resolve(destTemplate, `${fontName.toLowerCase()}.${template}`);
}
if (type !== 'template') {
file = path.resolve(dest, `${fontName}.${type}`);
} else {
file = path.resolve(destTemplate, `${fontName.toLowerCase()}.${template}`);
}
return fs.outputFile(file, content);
}))
.then(() => processScss());
});
return fs.outputFile(file, content);
}))
.then(() => processScss())
.then(() => fileSystemHelper.remove(path.join(config.desPath, '/style/icons')));
});
});
};
module.exports = buildFont;

View File

@@ -6,16 +6,17 @@
const Svgo = require('svgo');
const optimizeSvg = (svg) => {
const defaultOptions = [
{ convertShapeToPath: false },
{ mergePaths: false },
{ inlineStyles: { onlyMatchedOnce: false } },
{ removeAttrs: { attrs: '(fill|stroke.*)' } },
{ removeTitle: true },
];
const optimizeSvg = (svg, options = []) => {
const svgo = new Svgo({
plugins: [
{ removeHiddenElems: false },
{ convertShapeToPath: false },
{ mergePaths: false },
{ inlineStyles: { onlyMatchedOnce: false } },
{ removeAttrs: { attrs: '(fill|stroke.*)' } },
{ removeTitle: true },
],
plugins: defaultOptions.concat(options),
});
return svgo.optimize(svg)

View File

@@ -18,7 +18,7 @@ const processSvgs = (svgFiles, srcPath, desPath) => {
const desSvgPath = path.join(desPath, svgFile);
const svg = fs.readFileSync(svgPath);
return optimizeSvg(svg)
return optimizeSvg(svg, [ { removeHiddenElems: false } ])
.then((processedSvg) => {
fs.writeFileSync(desSvgPath, processedSvg);
});

View File

@@ -0,0 +1,36 @@
/**
* @license
* Copyright Akveo. All Rights Reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*/
const fs = require('fs-extra');
const globby = require('globby');
const path = require('path');
const config = require('../config');
const fileSystemHelper = require('../helpers/fs-helper');
const optimizeSvg = require('./oprimize-svg');
const prepareSVGsForFonts = () => {
const srcPath = path.resolve(config.desPath, '**/svg/*.svg');
const destPath = path.join(config.desPath, '/style/icons/svg');
fileSystemHelper.mkDirByPathSync(destPath);
return globby([srcPath])
.then(foundFiles => {
return Promise.all(foundFiles.map((svgFile) => {
const filesName = path.basename(svgFile);
const desSvgPath = path.join(destPath, filesName);
const svg = fs.readFileSync(svgFile);
return optimizeSvg(svg)
.then((processedSvg) => {
fs.writeFileSync(desSvgPath, processedSvg);
});
}));
});
};
module.exports = prepareSVGsForFonts;

View File

@@ -1,12 +1,15 @@
<!DOCTYPE html>
<html lang="en">
<title></title>
<link rel="stylesheet" href="package-build/style/eva-icons.css">
<script src="https://unpkg.com/eva-icons"></script>
<body>
<i data-eva="github"></i>
<i data-eva="github" data-eva-fill="blue" data-eva-hover="true"></i>
<i class="eva eva-5x eva-github"></i>
<script>
eva.replace({ animation: { type: 'pulse', infinite: true, hover: false }, fill: 'red', width: '100px', height: '100px' })
</script>