icon-maker-loader - npm Package Compare versions

.eslintignore

.travis.yml

create-tmp-dir.js

test/2svg/yin-yan-3.svg

test/entry.js

test/index.js

test/package.json

test/svg/bla.svg

test/svg/yin-yan-2.svg

test/svg/yin-yan.svg

test/webpack.config.js

272

index.js

		const loaderUtils = require('loader-utils');
		const fontgen = require('webfonts-generator');
		const IconMaker = require('icon-maker');
		const path = require('path');
		const glob = require('glob');
		const fs = require('fs');
		const createTmpDir = require('./create-tmp-dir.js');

		var mimeTypes = {
		'eot': 'application/vnd.ms-fontobject',
		'svg': 'image/svg+xml',
		'ttf': 'application/x-font-ttf',
		'woff': 'application/font-woff'
		};
		const tmpFolder = createTmpDir();

		function absolute(from, to) {
		if (arguments.length < 2) {
		return function (to) {
		return path.resolve(from, to);
		};
		}
		return path.resolve(from, to);
		}
		const fonts = {};

		function getFilesAndDeps(patterns, context) {
		var files = [];
		var filesDeps = [];
		var directoryDeps = [];

		function addFile(file) {
		filesDeps.push(file);
		files.push(absolute(context, file));
		const writeFontFiles = (fontFamily, font, cb) => {
		const pathToFontJs = path.join(tmpFolder, `${fontFamily}.js`);
		font.iconMaker.run((err, outFont) => {
		if (err) {
		throw err;
		}

		function addByGlob(globExp) {
		var globOptions = {cwd: context};

		var foundFiles = glob.sync(globExp, globOptions);
		files = files.concat(foundFiles.map(absolute(context)));

		var globDirs = glob.sync(path.dirname(globExp) + '/', globOptions);
		directoryDeps = directoryDeps.concat(globDirs.map(absolute(context)));
		}

		// Re-work the files array.
		patterns.forEach(function (pattern) {
		if (glob.hasMagic(pattern)) {
		addByGlob(pattern);
		Promise.all(outFont.fontFiles.map(fontFile => new Promise((resolve, reject) => {
		fs.writeFile(path.join(tmpFolder, path.basename(fontFile.path)), fontFile.contents.toString(), writeErr => {
		if (writeErr) {
		reject(writeErr);
		} else {
		resolve();
		}
		else {
		addFile(pattern);
		}
		});
		})).concat([
		new Promise((resolve, reject) => {
		fs.writeFile(path.join(tmpFolder, `${fontFamily}.css`), outFont.css, writeErr => {
		if (writeErr) {
		reject(writeErr);
		} else {
		resolve();
		}
		});
		}),
		new Promise((resolve, reject) => {
		fs.writeFile(pathToFontJs, `
		var style;
		try {
		style = require("./${fontFamily}.css");
		} catch(e) {
		if (e.code !== 'MODULE_NOT_FOUND') throw e;
		style = {};
		}
		module.exports = style.locals;`, writeErr => {
		if (writeErr) {
		reject(writeErr);
		} else {
		resolve();
		}
		});
		})
		])).then(cb.bind(undefined, undefined), rejects => {
		if (rejects) {
		cb(rejects);
		}
		});
		});
		};

		return {
		files: files,
		dependencies: {
		directories: directoryDeps,
		files: filesDeps
		}
		};
		}

		module.exports = function iconMakerLoader(content) {
		this.cacheable();
		module.exports = function iconMakerLoader() {
		const pathToSvg = this.resourcePath;
		const params = loaderUtils.parseQuery(this.query);
		var config;
		try {
		config = JSON.parse(content);
		}
		catch (ex) {
		config = this.exec(content, this.resourcePath);
		}

		config.__dirname = path.dirname(this.resourcePath);

		// Sanity check
		/*
		if(typeof config.fontName != 'string" \|\| typeof config.files != "array") {
		this.reportError("Typemismatch in your config. Verify your config for correct types.");
		return false;
		}
		*/
		var filesAndDeps = getFilesAndDeps(config.files, this.context);
		filesAndDeps.dependencies.files.forEach(this.addDependency.bind(this));
		filesAndDeps.dependencies.directories.forEach(this.addContextDependency.bind(this));
		config.files = filesAndDeps.files;

		// With everything set up, let's make an ACTUAL config.
		var formats = config.types \|\| ['eot', 'woff', 'ttf', 'svg'];
		if (formats.constructor !== Array) {
		formats = [formats];
		}

		var fontconf = {
		files: config.files,
		fontName: config.fontName,
		types: formats,
		order: formats,
		fontHeight: config.fontHeight \|\| 1000, // Fixes conversion issues with small svgs
		templateOptions: {
		baseClass: config.baseClass \|\| "icon",
		classPrefix: "classPrefix" in config ? config.classPrefix : "icon-"
		},
		dest: "",
		writeFiles: false,
		formatOptions: config.formatOptions \|\| {}
		};

		// This originally was in the object notation itself.
		// Unfortunately that actually broke my editor's syntax-highlighting...
		// ... what a shame.
		if(typeof config.rename == "function") {
		fontconf.rename = config.rename;
		const fileName = path.basename(pathToSvg, '.svg');
		const fontFamily = params.fontFamily \|\| 'default';
		const font = fonts[fontFamily];
		const tmpFolderForNode = path.join('icon-maker-loader', path.relative(__dirname, tmpFolder)).replace(/\\/g, '/');
		const moduleContent = `
		var style = require(${JSON.stringify(`${tmpFolderForNode}/${fontFamily}.js`)});
		if (style) {
		module.exports = style[${JSON.stringify(fontFamily)}] + " " + style[${JSON.stringify(`${fontFamily}-${fileName}`)}];
		} else {
		fontconf.rename = function(f) {
		return path.basename(f, ".svg");
		}
		module.exports = ${JSON.stringify(`${fontFamily} ${fontFamily}-${fileName}`)};
		}
		`;

		if (config.cssTemplate) {
		fontconf.cssTemplate = absolute(this.context, config.cssTemplate);
		}

		for(var option in config.templateOptions) {
		if(config.templateOptions.hasOwnProperty(option)) {
		fontconf.templateOptions[option] = config.templateOptions[option];
		if (font.paths.indexOf(pathToSvg) === -1) {
		font.count -= 1;
		if (font.count === 0) {
		writeFontFiles(fontFamily, font, err => {
		if (err) {
		throw err;
		}
		font.doOnRun.forEach(fn => fn());
		fonts[fontFamily] = {
		paths: fonts[fontFamily].paths,
		created: true
		};
		});
		}

		// svgicons2svgfont stuff
		var keys = [
		"fixedWidth",
		"centerHorizontally",
		"normalize",
		"fontHeight",
		"round",
		"descent"
		];
		for (var x in keys) {
		if (typeof config[keys[x]] != "undefined") {
		fontconf[keys[x]] = config[keys[x]];
		}
		if (font.created) {
		return moduleContent;
		} else {
		const cb = this.async();
		font.doOnRun.push(() => {
		font.paths.push(pathToSvg);
		cb(undefined, moduleContent);
		});
		return undefined;
		}

		var cb = this.async();
		var self = this;
		var opts = this.options;
		var pub = (
		opts.output.publicPath \|\| "/"
		);
		var embed = !!params.embed;

		if (fontconf.cssTemplate) {
		this.addDependency(fontconf.cssTemplate)
		}

		fontgen(fontconf, function (err, res) {
		if (err) {
		return cb(err);
		}
		var urls = {};
		for (var i in formats) {
		var format = formats[i];
		if (!embed) {
		var filename = config.fileName \|\| params.fileName \|\| "[hash]-[fontname][ext]";
		filename = filename
		.replace("[fontname]", fontconf.fontName)
		.replace("[ext]", "." + format);
		var url = loaderUtils.interpolateName(this,
		filename,
		{
		context: self.options.context \|\| this.context,
		content: res[format]
		}
		);
		urls[format] = path.join(pub, url).replace(/\\/g, '/');
		self.emitFile(url, res[format]);
		} else {
		urls[format] = 'data:'
		+ mimeTypes[format]
		+ ';charset=utf-8;base64,'
		+ (new Buffer(res[format]).toString('base64'));
		}
		}
		cb(null, res.generateCss(urls));
		});
		} else {
		return moduleContent;
		}
		};
		module.exports.pitch = function iconMakerLoaderPitch(pathToSvg) {
		const params = loaderUtils.parseQuery(this.query);
		const fontFamily = params.fontFamily \|\| 'default';
		if (fonts[fontFamily] === undefined \|\| fonts[fontFamily].count === undefined) {
		fonts[fontFamily] = {
		count: 0,
		paths: fonts[fontFamily] === undefined ? [] : fonts[fontFamily].paths,
		created: fonts[fontFamily] === undefined ? false : fonts[fontFamily].created,
		doOnRun: [],
		iconMaker: new IconMaker({ fontFamily })
		};
		}
		const font = fonts[fontFamily];
		if (font.paths.indexOf(pathToSvg) === -1) {
		font.count += 1;
		font.iconMaker.addSvg(pathToSvg, fontFamily);
		}
		};
		module.exports.raw = true;

12

package.json

		{
		"name": "icon-maker-loader",
		"version": "0.0.2",
		"version": "0.1.0",
		"description": "",
		"main": "index.js",
		"scripts": {
		"test": "echo \"Error: no test specified\" && exit 1"
		"lint": "eslint --ext .js,.jsx .",
		"test": "npm run lint && node test/index.js"
		},
		@@ -24,14 +25,15 @@ "keywords": [
		"eslint": "^3.5.0",
		"eslint-config-airbnb": "^11.1.0",
		"eslint-config-airbnb": "^12.0.0",
		"eslint-plugin-import": "^1.15.0",
		"eslint-plugin-jsx-a11y": "^2.2.2",
		"eslint-plugin-react": "^6.2.2",
		"eslint-plugin-sort-class-members": "^1.1.0"
		"webpack": "^1.13.2"
		},
		"dependencies": {
		"glob": "^7.0.6",
		"icon-maker": "^0.1.0",
		"icon-maker": "^0.2.0",
		"loader-utils": "^0.2.16",
		"node-uuid": "^1.4.7",
		"path": "^0.12.7"
		}
		}

.editorconfig

Sorry, the diff of this file is not supported yet

.eslintrc

Sorry, the diff of this file is not supported yet

.npmignore

Sorry, the diff of this file is not supported yet

icon-maker-loader - npm Package Compare versions

New alerts

Fixed alerts

Improved metrics

Worsened metrics

Dependency changes