SHARE
TWEET

Untitled

a guest Jul 21st, 2019 55 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. #!/usr/bin/env node
  2.  
  3. const program = require('commander')
  4. const fsp = require('fs').promises
  5. const path = require('path');
  6. const chalk = require('chalk')
  7. const globby = require("globby");
  8. const cheerio=require('cheerio');
  9. const css = require('css');
  10.  
  11. program
  12.     .version('0.0.1')
  13.     .description('svg图标生成脚本 by syrxw')
  14.     .option('-g, --generate', '生成')
  15.  
  16. const svgFilePath = path.resolve("client/static/icons.svg");
  17. const dir = path.resolve("client/assets/image/svg_icons");
  18. const filePahts = globby.sync(["**/*.svg"], { cwd: path.resolve("client/assets/image/svg_icons") })
  19.  
  20. let svgFile = null;
  21. function splitFileName(text) {
  22.     var pattern = /\.{1}[a-z]{1,}$/;
  23.     if (pattern.exec(text) !== null) {
  24.         return (text.slice(0, pattern.exec(text).index));
  25.     } else {
  26.         return text;
  27.     }
  28. }
  29.  
  30. // 生成css AST语法树
  31. function parseCSS(content){
  32.     const obj = css.parse(content)
  33.     const rules = obj.stylesheet.rules
  34.     return rules.map(item => {
  35.         return {
  36.             selector: item.selectors[0],
  37.             declarations: item.declarations.map(kitem => {
  38.                 return {
  39.                     property: kitem.property,
  40.                     value: kitem.value
  41.                 }
  42.             })
  43.         }
  44.     })
  45. }
  46.  
  47. // 读取svg文件
  48. async function readSvgFile(){
  49.     try{
  50.         const data  = await fsp.readFile(svgFilePath)
  51.         svgFile = cheerio.load(data,{ xmlMode: true });
  52.     }catch(err){
  53.         console.log(chalk.red('icons.svg文件不存在或文件损坏'))
  54.         return false;
  55.     }
  56. }
  57.  
  58. async function readSvgIcons(){
  59.     try{
  60.         svgFile('defs').html("")
  61.  
  62.         for(const file of filePahts){
  63.             const data = await fsp.readFile(path.join(dir,file))
  64.             const $ = cheerio.load(data,{ xmlMode: true });
  65.  
  66.             const fileName = splitFileName(file)
  67.  
  68.             if($('path').length < 1){
  69.                 return false
  70.             }else{
  71.                 if($('style').length>0){
  72.                     const parsrCssRst = parseCSS($('style').html())
  73.                     parsrCssRst.forEach(item =>{
  74.                         item.declarations.forEach(declar => {
  75.                             $(item.selector).attr(declar.property,declar.value)
  76.                         })
  77.                     })
  78.                 }
  79.  
  80.                 const element = `<symbol id="icon-${fileName}" viewBox="0 0 200 200">${$('path')}</symbol>`
  81.                 svgFile('defs').append(element)
  82.             }
  83.         }
  84.  
  85.     }catch(err){
  86.         console.log(chalk.red(err))
  87.         return false;
  88.     }
  89. }
  90.  
  91. async function writeIconFile(){
  92.     try{
  93.         await fsp.writeFile(svgFilePath,svgFile.root().html())
  94.     }catch(err){
  95.         console.log(chalk.red(err))
  96.         return false;
  97.     }
  98. }
  99.  
  100. async function main(){
  101.     try{
  102.         await readSvgFile();
  103.     }catch(e){
  104.         console.log(chalk.red(err))
  105.     }
  106.  
  107.     try{
  108.         await readSvgIcons();
  109.     }catch(e){
  110.         console.log(chalk.red(err))
  111.     }
  112.  
  113.     try{
  114.         await writeIconFile();
  115.     }catch(e){
  116.         console.log(chalk.red(err))
  117.     }
  118. }
  119.  
  120. main()
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top