爲方便引入svg,把全部的svg,node生成一個js

生成svg模版

/* 由於要在icon組件中使用到svgs文件,因此直接將文件寫到icon組件目錄下
  框架開發時候寫入到src/lib/icon 目錄底下
  業務開發的時候寫入到node_modules/snk-mobile/src/lib/icon目錄底下
  因此先判斷是否存在路徑 而後再寫入
  這樣就方便icon組件進行引用
*/

const path = require('path');
const fs = require('fs');

const svgDir = path.resolve(__dirname, '../../assets/svgs');

function startWirteSvgFile(successCallBack) {
  // 生成js文件
  console.log('start create svg file!');
  readSvgs().then((data) => {
    const svgFile = `export default${JSON.stringify(Object.assign.apply(this, data))}`;
    const pathForFrameWork = path.resolve(__dirname, '../../assets');
    const pathForBusiness = path.resolve(__dirname, '../../assets');

    writeSvgConfigIntoFile(pathForBusiness, svgFile, (isScuccess) => {
      if (!isScuccess) {
        writeSvgConfigIntoFile(pathForFrameWork, svgFile, (re, err) => {
          if (re) {
            successCallBack();
          } else {
            console.error(err);
            console.error('svg建立失敗!');
          }
        });
      } else {
        successCallBack();
      }
    });
  }).catch((err) => {
    console.error(err);
    console.error('svg建立失敗!');
  });
}

function writeSvgConfigIntoFile(pathUrl, svgFile, cb) {
  fs.exists(pathUrl, (isExists) => {
    if (isExists) {
      fs.writeFile(`${pathUrl}/svgs.js`, svgFile, (err) => {
        if (err) {
          cb && cb(false, err);
        } else {
          console.log('svg建立成功!');
          cb && cb(true);
        }
      });
    } else {
      cb && cb(false);
    }
  });
}

// 讀取單個文件
function readfile(filename) {
  return new Promise((resolve, reject) => {
    fs.readFile(path.join(svgDir, filename), 'utf8', (err, data) => {
      data = data.replace(/<\?xml.*?\?>|<!--.*?-->|<path fill='#[a-zA-Z0-9]'|<!DOCTYPE.*?>/g, '');
      data = data.replace(/<path fill="#[a-zA-Z0-9]+"|<path/g, '<path fill="#ef473a"');
      data = data.replace(/class/g, 'c');
      if (err) reject(err);
      resolve({
        [filename.slice(0, filename.lastIndexOf('.'))]: data,
      });
    });
  });
}

// 讀取SVG文件夾下全部svg
function readSvgs() {
  return new Promise((resolve, reject) => {
    fs.readdir(svgDir, (err, files) => {
      if (err) reject(err);
      Promise.all(files.map(filename => readfile(filename)))
        .then(data => resolve(data))
        .catch(() => reject(err));
    });
  });
}
startWirteSvgFile()
複製代碼
相關文章
相關標籤/搜索