Comments (4)
Start a new pull request in StackBlitz Codeflow.
from unplugin-icons.
I encountered the same problem, I roll back the vue version to 3.3.8.
perhaps because of this: vuejs/core#10011
from unplugin-icons.
I'm also having similar issue. @userquin can you help us with this? any suggestions?
from unplugin-icons.
We resolved it with this patch using pnpm
diff --git a/dist/chunk-2VDUV4E5.js b/dist/chunk-2VDUV4E5.js
index c6616b09e35d47be4faa93008f9382bf39bfd0e0..5c3b1257e1fcd43230dafdf3370adc25cf63bbde 100644
--- a/dist/chunk-2VDUV4E5.js
+++ b/dist/chunk-2VDUV4E5.js
@@ -1,7 +1,4 @@
-import {
- __spreadProps,
- __spreadValues
-} from "./chunk-KLNSLHAC.js";
+import { __spreadProps, __spreadValues } from "./chunk-KLNSLHAC.js";
// src/index.ts
import { createUnplugin } from "unplugin";
@@ -18,15 +15,17 @@ async function resolveOptions(options) {
compiler = await guessCompiler(),
jsx = guessJSX(),
customCollections = {},
- iconCustomizer = () => {
- },
+ iconCustomizer = () => { },
transform,
- autoInstall = false
+ autoInstall = false,
} = options;
- const webComponents = Object.assign({
- autoDefine: false,
- iconPrefix: "icon"
- }, options.webComponents);
+ const webComponents = Object.assign(
+ {
+ autoDefine: false,
+ iconPrefix: "icon",
+ },
+ options.webComponents,
+ );
debug("compiler", compiler);
return {
scale,
@@ -38,22 +37,22 @@ async function resolveOptions(options) {
jsx,
webComponents,
transform,
- autoInstall
+ autoInstall,
};
}
async function guessCompiler() {
- return await getVueVersion() || (isPackageExists("@svgr/core") ? "jsx" : "vue3");
+ return (
+ (await getVueVersion()) || (isPackageExists("@svgr/core") ? "jsx" : "vue3")
+ );
}
function guessJSX() {
- if (isPackageExists("preact"))
- return "preact";
+ if (isPackageExists("preact")) return "preact";
return "react";
}
async function getVueVersion() {
try {
const result = await getPackageInfo("vue");
- if (!result)
- return null;
+ if (!result) return null;
return result.version.startsWith("2.") ? "vue2" : "vue3";
} catch (e) {
return null;
@@ -79,13 +78,20 @@ import { camelize } from "@iconify/utils/lib/misc/strings";
var JSXCompiler = async (svg, collection, icon, options) => {
var _a;
const svgrCore = await importModule("@svgr/core");
- const svgr = svgrCore.transform || (svgrCore.default ? (_a = svgrCore.default.transform) != null ? _a : svgrCore.default : svgrCore.default) || svgrCore;
+ const svgr =
+ svgrCore.transform ||
+ (svgrCore.default
+ ? (_a = svgrCore.default.transform) != null
+ ? _a
+ : svgrCore.default
+ : svgrCore.default) ||
+ svgrCore;
let res = await svgr(
svg,
{
- plugins: ["@svgr/plugin-jsx"]
+ plugins: ["@svgr/plugin-jsx"],
},
- { componentName: camelize(`${collection}-${icon}`) }
+ { componentName: camelize(`${collection}-${icon}`) },
);
if (options.jsx !== "react")
res = res.replace('import * as React from "react";', "");
@@ -126,14 +132,17 @@ var QwikCompiler = async (svg, collection, icon, options) => {
const defaultOptions = {
importSource: "@builder.io/qwik",
runtime: "automatic",
- componentName: camelize2(`${collection}-${icon}`)
+ componentName: camelize2(`${collection}-${icon}`),
};
const mergedOptions = Object.assign({}, defaultOptions, options);
const svgx = await importModule2("@svgx/core");
const toJsxComponent = svgx.toJsxComponent;
- const res = toJsxComponent(svg, __spreadProps(__spreadValues({}, mergedOptions), {
- defaultExport: true
- }));
+ const res = toJsxComponent(
+ svg,
+ __spreadProps(__spreadValues({}, mergedOptions), {
+ defaultExport: true,
+ }),
+ );
return res;
};
@@ -144,7 +153,9 @@ var RawCompiler = (svg) => {
// src/core/compilers/solid.ts
var SolidCompiler = (svg) => {
- const svgWithProps = svg.replace(/([{}])/g, "{'$1'}").replace(new RegExp("(?<=<svg[\\s\\S]*?)(>)", "i"), "{...props}>");
+ const svgWithProps = svg
+ .replace(/([{}])/g, "{'$1'}")
+ .replace(new RegExp("(?<=<svg[\\s\\S]*?)(>)", "i"), "{...props}>");
return `export default (props = {}) => ${svgWithProps}`;
};
@@ -158,47 +169,40 @@ var SvelteCompiler = (svg) => {
return `${openTag}${content}${closeTag}`;
};
function escapeSvelte(str) {
- return str.replace(/{/g, "{").replace(/}/g, "}").replace(/`/g, "`").replace(/\\([trn])/g, " ");
+ return str
+ .replace(/{/g, "{")
+ .replace(/}/g, "}")
+ .replace(/`/g, "`")
+ .replace(/\\([trn])/g, " ");
}
// src/core/compilers/vue2.ts
import { importModule as importModule3 } from "local-pkg";
// src/core/svgId.ts
-var randIdFn = "const __randId = () => Math.random().toString(36).substr(2, 10);";
function handleSVGId(svg) {
- const hasID = /="url\(#/.test(svg);
- const idMap = {};
- let injectScripts = "";
- if (hasID) {
- svg = svg.replace(/\b([\w-]+?)="url\(#(.+?)\)"/g, (_, s, id) => {
- idMap[id] = `'${id}':'uicons-'+__randId()`;
- return `:${s}="'url(#'+idMap['${id}']+')'"`;
- }).replace(/\bid="(.+?)"/g, (full, id) => {
- if (idMap[id])
- return `:id="idMap['${id}']"`;
- return full;
- });
- injectScripts = `${randIdFn}const idMap = {${Object.values(idMap).join(",")}};`;
- }
return {
- hasID,
+ hasID: false,
svg,
- injectScripts
+ injectScripts: "",
};
}
// src/core/compilers/vue2.ts
var Vue2Compiler = async (svg, collection, icon) => {
const { compile } = await importModule3("vue-template-compiler");
- const transpile = (await importModule3("vue-template-es2015-compiler")).default;
+ const transpile = (await importModule3("vue-template-es2015-compiler"))
+ .default;
const { injectScripts, svg: handled } = handleSVGId(svg);
const { render } = compile(handled);
const toFunction = (code2) => {
return `function () {${code2}}`;
};
- let code = transpile(`var __render__ = ${toFunction(render)}
-`, {});
+ let code = transpile(
+ `var __render__ = ${toFunction(render)}
+`,
+ {},
+ );
code = code.replace(/\s__(render|staticRenderFns)__\s/g, " $1 ");
code += `
/* vite-plugin-components disabled */
@@ -219,7 +223,7 @@ var Vue3Compiler = async (svg, collection, icon) => {
let { code } = compileTemplate({
source: handled,
id: `${collection}:${icon}`,
- filename: `${collection}-${icon}.vue`
+ filename: `${collection}-${icon}.vue`,
});
code = code.replace(/^export /gm, "");
code += `
@@ -231,10 +235,14 @@ export default { name: '${collection}-${icon}', render${injectScripts ? `, data(
// src/core/compilers/web-components.ts
import { camelize as camelize3 } from "@iconify/utils/lib/misc/strings";
-var WebComponentsCompiler = (svg, collection, icon, { webComponents: options }) => {
+var WebComponentsCompiler = (
+ svg,
+ collection,
+ icon,
+ { webComponents: options },
+) => {
let id = `${collection}-${icon}`;
- if (options.iconPrefix)
- id = `${options.iconPrefix}-${id}`;
+ if (options.iconPrefix) id = `${options.iconPrefix}-${id}`;
const name = camelize3(id);
let code = `export default class ${name} extends HTMLElement {`;
if (options.shadow) {
@@ -254,17 +262,17 @@ customElements.define('${id}', ${name})`;
// src/core/compilers/index.ts
var compilers = {
- "astro": AstroCompiler,
- "jsx": JSXCompiler,
- "marko": MarkoCompiler,
- "none": NoneCompiler,
- "raw": RawCompiler,
- "solid": SolidCompiler,
- "svelte": SvelteCompiler,
- "vue2": Vue2Compiler,
- "vue3": Vue3Compiler,
+ astro: AstroCompiler,
+ jsx: JSXCompiler,
+ marko: MarkoCompiler,
+ none: NoneCompiler,
+ raw: RawCompiler,
+ solid: SolidCompiler,
+ svelte: SvelteCompiler,
+ vue2: Vue2Compiler,
+ vue3: Vue3Compiler,
"web-components": WebComponentsCompiler,
- "qwik": QwikCompiler
+ qwik: QwikCompiler,
};
// src/core/loader.ts
@@ -277,8 +285,7 @@ function normalizeIconPath(path) {
return path.replace(iconPathRE, URL_PREFIXES[0]);
}
function resolveIconsPath(path) {
- if (!isIconPath(path))
- return null;
+ if (!isIconPath(path)) return null;
path = path.replace(iconPathRE, "");
const query = {};
const queryIndex = path.indexOf("?");
@@ -288,8 +295,7 @@ function resolveIconsPath(path) {
new URLSearchParams(queryRaw).forEach((value, key) => {
if (key === "raw")
query.raw = value === "" || value === "true" ? "true" : "false";
- else
- query[key] = value;
+ else query[key] = value;
});
}
path = path.replace(/\.\w+$/, "");
@@ -297,7 +303,7 @@ function resolveIconsPath(path) {
return {
collection,
icon,
- query
+ query,
};
}
async function generateComponent({ collection, icon, query }, options) {
@@ -309,7 +315,7 @@ async function generateComponent({ collection, icon, query }, options) {
customCollections,
iconCustomizer: providedIconCustomizer,
transform,
- autoInstall = false
+ autoInstall = false,
} = options;
const iconifyLoaderOptions = {
addXmlNs: false,
@@ -323,30 +329,31 @@ async function generateComponent({ collection, icon, query }, options) {
customizations: {
transform,
async iconCustomizer(collection2, icon2, props) {
- await (providedIconCustomizer == null ? void 0 : providedIconCustomizer(collection2, icon2, props));
+ await (providedIconCustomizer == null
+ ? void 0
+ : providedIconCustomizer(collection2, icon2, props));
Object.keys(query).forEach((p) => {
const v = query[p];
- if (p !== "raw" && v !== void 0 && v !== null)
- props[p] = v;
+ if (p !== "raw" && v !== void 0 && v !== null) props[p] = v;
});
- }
- }
+ },
+ },
};
const svg = await loadNodeIcon(collection, icon, iconifyLoaderOptions);
- if (!svg)
- throw new Error(`Icon \`${warn}\` not found`);
+ if (!svg) throw new Error(`Icon \`${warn}\` not found`);
const _compiler = query.raw === "true" ? "raw" : options.compiler;
if (_compiler) {
- const compiler = typeof _compiler === "string" ? compilers[_compiler] : await _compiler.compiler;
- if (compiler)
- return compiler(svg, collection, icon, options);
+ const compiler =
+ typeof _compiler === "string"
+ ? compilers[_compiler]
+ : await _compiler.compiler;
+ if (compiler) return compiler(svg, collection, icon, options);
}
throw new Error(`Unknown compiler: ${_compiler}`);
}
async function generateComponentFromPath(path, options) {
const resolved = resolveIconsPath(path);
- if (!resolved)
- return null;
+ if (!resolved) return null;
return generateComponent(resolved, options);
}
@@ -363,11 +370,15 @@ var unplugin = createUnplugin((options = {}) => {
const queryIndex = normalizedId.indexOf("?");
const res = `${(queryIndex > -1 ? normalizedId.slice(0, queryIndex) : normalizedId).replace(/\.\w+$/i, "").replace(/^\//, "")}${queryIndex > -1 ? `?${normalizedId.slice(queryIndex + 1)}` : ""}`;
const resolved2 = resolveIconsPath(res);
- const compiler = ((_a = resolved2 == null ? void 0 : resolved2.query) == null ? void 0 : _a.raw) === "true" ? "raw" : options.compiler;
+ const compiler =
+ ((_a = resolved2 == null ? void 0 : resolved2.query) == null
+ ? void 0
+ : _a.raw) === "true"
+ ? "raw"
+ : options.compiler;
if (compiler && typeof compiler !== "string") {
const ext = compiler.extension;
- if (ext)
- return `${res}.${ext.startsWith(".") ? ext.slice(1) : ext}`;
+ if (ext) return `${res}.${ext.startsWith(".") ? ext.slice(1) : ext}`;
} else {
switch (compiler) {
case "astro":
@@ -393,23 +404,21 @@ var unplugin = createUnplugin((options = {}) => {
},
async load(id) {
const config = await resolved;
- const code = await generateComponentFromPath(id, config) || null;
+ const code = (await generateComponentFromPath(id, config)) || null;
if (code) {
return {
code,
- map: { version: 3, mappings: "", sources: [] }
+ map: { version: 3, mappings: "", sources: [] },
};
}
},
rollup: {
api: {
- config: options
- }
- }
+ config: options,
+ },
+ },
};
});
var src_default = unplugin;
-export {
- src_default
-};
+export { src_default };
diff --git a/dist/chunk-KTXRBLM5.cjs b/dist/chunk-KTXRBLM5.cjs
index 89b33ea73a91fbb35b41511b9d594fde93aae3dc..9435d1a6af7822968797f411d485b11f07104938 100644
--- a/dist/chunk-KTXRBLM5.cjs
+++ b/dist/chunk-KTXRBLM5.cjs
@@ -1,14 +1,18 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+function _interopRequireDefault(obj) {
+ return obj && obj.__esModule ? obj : { default: obj };
+}
-var _chunkHZ6LTHYMcjs = require('./chunk-HZ6LTHYM.cjs');
+var _chunkHZ6LTHYMcjs = require("./chunk-HZ6LTHYM.cjs");
// src/index.ts
-var _unplugin = require('unplugin');
+var _unplugin = require("unplugin");
// src/core/options.ts
-var _localpkg = require('local-pkg');
-var _debug = require('debug'); var _debug2 = _interopRequireDefault(_debug);
+var _localpkg = require("local-pkg");
+var _debug = require("debug");
+var _debug2 = _interopRequireDefault(_debug);
var debug = _debug2.default.call(void 0, "unplugin-icons:options");
async function resolveOptions(options) {
const {
@@ -18,15 +22,17 @@ async function resolveOptions(options) {
compiler = await guessCompiler(),
jsx = guessJSX(),
customCollections = {},
- iconCustomizer = () => {
- },
+ iconCustomizer = () => {},
transform,
- autoInstall = false
+ autoInstall = false,
} = options;
- const webComponents = Object.assign({
- autoDefine: false,
- iconPrefix: "icon"
- }, options.webComponents);
+ const webComponents = Object.assign(
+ {
+ autoDefine: false,
+ iconPrefix: "icon",
+ },
+ options.webComponents,
+ );
debug("compiler", compiler);
return {
scale,
@@ -38,22 +44,23 @@ async function resolveOptions(options) {
jsx,
webComponents,
transform,
- autoInstall
+ autoInstall,
};
}
async function guessCompiler() {
- return await getVueVersion() || (_localpkg.isPackageExists.call(void 0, "@svgr/core") ? "jsx" : "vue3");
+ return (
+ (await getVueVersion()) ||
+ (_localpkg.isPackageExists.call(void 0, "@svgr/core") ? "jsx" : "vue3")
+ );
}
function guessJSX() {
- if (_localpkg.isPackageExists.call(void 0, "preact"))
- return "preact";
+ if (_localpkg.isPackageExists.call(void 0, "preact")) return "preact";
return "react";
}
async function getVueVersion() {
try {
const result = await _localpkg.getPackageInfo.call(void 0, "vue");
- if (!result)
- return null;
+ if (!result) return null;
return result.version.startsWith("2.") ? "vue2" : "vue3";
} catch (e) {
return null;
@@ -61,7 +68,7 @@ async function getVueVersion() {
}
// src/core/loader.ts
-var _nodeloader = require('@iconify/utils/lib/loader/node-loader');
+var _nodeloader = require("@iconify/utils/lib/loader/node-loader");
// src/core/compilers/astro.ts
var AstroCompiler = (svg) => {
@@ -75,17 +82,24 @@ ${svgWithProps}`;
// src/core/compilers/jsx.ts
-var _strings = require('@iconify/utils/lib/misc/strings');
+var _strings = require("@iconify/utils/lib/misc/strings");
var JSXCompiler = async (svg, collection, icon, options) => {
var _a;
const svgrCore = await _localpkg.importModule.call(void 0, "@svgr/core");
- const svgr = svgrCore.transform || (svgrCore.default ? (_a = svgrCore.default.transform) != null ? _a : svgrCore.default : svgrCore.default) || svgrCore;
+ const svgr =
+ svgrCore.transform ||
+ (svgrCore.default
+ ? (_a = svgrCore.default.transform) != null
+ ? _a
+ : svgrCore.default
+ : svgrCore.default) ||
+ svgrCore;
let res = await svgr(
svg,
{
- plugins: ["@svgr/plugin-jsx"]
+ plugins: ["@svgr/plugin-jsx"],
},
- { componentName: _strings.camelize.call(void 0, `${collection}-${icon}`) }
+ { componentName: _strings.camelize.call(void 0, `${collection}-${icon}`) },
);
if (options.jsx !== "react")
res = res.replace('import * as React from "react";', "");
@@ -121,19 +135,25 @@ var NoneCompiler = (svg) => {
// src/core/compilers/qwik.ts
-
var QwikCompiler = async (svg, collection, icon, options) => {
const defaultOptions = {
importSource: "@builder.io/qwik",
runtime: "automatic",
- componentName: _strings.camelize.call(void 0, `${collection}-${icon}`)
+ componentName: _strings.camelize.call(void 0, `${collection}-${icon}`),
};
const mergedOptions = Object.assign({}, defaultOptions, options);
const svgx = await _localpkg.importModule.call(void 0, "@svgx/core");
const toJsxComponent = svgx.toJsxComponent;
- const res = toJsxComponent(svg, _chunkHZ6LTHYMcjs.__spreadProps.call(void 0, _chunkHZ6LTHYMcjs.__spreadValues.call(void 0, {}, mergedOptions), {
- defaultExport: true
- }));
+ const res = toJsxComponent(
+ svg,
+ _chunkHZ6LTHYMcjs.__spreadProps.call(
+ void 0,
+ _chunkHZ6LTHYMcjs.__spreadValues.call(void 0, {}, mergedOptions),
+ {
+ defaultExport: true,
+ },
+ ),
+ );
return res;
};
@@ -144,7 +164,9 @@ var RawCompiler = (svg) => {
// src/core/compilers/solid.ts
var SolidCompiler = (svg) => {
- const svgWithProps = svg.replace(/([{}])/g, "{'$1'}").replace(new RegExp("(?<=<svg[\\s\\S]*?)(>)", "i"), "{...props}>");
+ const svgWithProps = svg
+ .replace(/([{}])/g, "{'$1'}")
+ .replace(new RegExp("(?<=<svg[\\s\\S]*?)(>)", "i"), "{...props}>");
return `export default (props = {}) => ${svgWithProps}`;
};
@@ -158,47 +180,43 @@ var SvelteCompiler = (svg) => {
return `${openTag}${content}${closeTag}`;
};
function escapeSvelte(str) {
- return str.replace(/{/g, "{").replace(/}/g, "}").replace(/`/g, "`").replace(/\\([trn])/g, " ");
+ return str
+ .replace(/{/g, "{")
+ .replace(/}/g, "}")
+ .replace(/`/g, "`")
+ .replace(/\\([trn])/g, " ");
}
// src/core/compilers/vue2.ts
-
// src/core/svgId.ts
-var randIdFn = "const __randId = () => Math.random().toString(36).substr(2, 10);";
function handleSVGId(svg) {
- const hasID = /="url\(#/.test(svg);
- const idMap = {};
- let injectScripts = "";
- if (hasID) {
- svg = svg.replace(/\b([\w-]+?)="url\(#(.+?)\)"/g, (_, s, id) => {
- idMap[id] = `'${id}':'uicons-'+__randId()`;
- return `:${s}="'url(#'+idMap['${id}']+')'"`;
- }).replace(/\bid="(.+?)"/g, (full, id) => {
- if (idMap[id])
- return `:id="idMap['${id}']"`;
- return full;
- });
- injectScripts = `${randIdFn}const idMap = {${Object.values(idMap).join(",")}};`;
- }
return {
- hasID,
+ hasID: false,
svg,
- injectScripts
+ injectScripts: "",
};
}
// src/core/compilers/vue2.ts
var Vue2Compiler = async (svg, collection, icon) => {
- const { compile } = await _localpkg.importModule.call(void 0, "vue-template-compiler");
- const transpile = (await _localpkg.importModule.call(void 0, "vue-template-es2015-compiler")).default;
+ const { compile } = await _localpkg.importModule.call(
+ void 0,
+ "vue-template-compiler",
+ );
+ const transpile = (
+ await _localpkg.importModule.call(void 0, "vue-template-es2015-compiler")
+ ).default;
const { injectScripts, svg: handled } = handleSVGId(svg);
const { render } = compile(handled);
const toFunction = (code2) => {
return `function () {${code2}}`;
};
- let code = transpile(`var __render__ = ${toFunction(render)}
-`, {});
+ let code = transpile(
+ `var __render__ = ${toFunction(render)}
+`,
+ {},
+ );
code = code.replace(/\s__(render|staticRenderFns)__\s/g, " $1 ");
code += `
/* vite-plugin-components disabled */
@@ -214,12 +232,15 @@ export default {
// src/core/compilers/vue3.ts
var Vue3Compiler = async (svg, collection, icon) => {
- const { compileTemplate } = await _localpkg.importModule.call(void 0, "@vue/compiler-sfc");
+ const { compileTemplate } = await _localpkg.importModule.call(
+ void 0,
+ "@vue/compiler-sfc",
+ );
const { injectScripts, svg: handled } = handleSVGId(svg);
let { code } = compileTemplate({
source: handled,
id: `${collection}:${icon}`,
- filename: `${collection}-${icon}.vue`
+ filename: `${collection}-${icon}.vue`,
});
code = code.replace(/^export /gm, "");
code += `
@@ -231,10 +252,14 @@ export default { name: '${collection}-${icon}', render${injectScripts ? `, data(
// src/core/compilers/web-components.ts
-var WebComponentsCompiler = (svg, collection, icon, { webComponents: options }) => {
+var WebComponentsCompiler = (
+ svg,
+ collection,
+ icon,
+ { webComponents: options },
+) => {
let id = `${collection}-${icon}`;
- if (options.iconPrefix)
- id = `${options.iconPrefix}-${id}`;
+ if (options.iconPrefix) id = `${options.iconPrefix}-${id}`;
const name = _strings.camelize.call(void 0, id);
let code = `export default class ${name} extends HTMLElement {`;
if (options.shadow) {
@@ -254,17 +279,17 @@ customElements.define('${id}', ${name})`;
// src/core/compilers/index.ts
var compilers = {
- "astro": AstroCompiler,
- "jsx": JSXCompiler,
- "marko": MarkoCompiler,
- "none": NoneCompiler,
- "raw": RawCompiler,
- "solid": SolidCompiler,
- "svelte": SvelteCompiler,
- "vue2": Vue2Compiler,
- "vue3": Vue3Compiler,
+ astro: AstroCompiler,
+ jsx: JSXCompiler,
+ marko: MarkoCompiler,
+ none: NoneCompiler,
+ raw: RawCompiler,
+ solid: SolidCompiler,
+ svelte: SvelteCompiler,
+ vue2: Vue2Compiler,
+ vue3: Vue3Compiler,
"web-components": WebComponentsCompiler,
- "qwik": QwikCompiler
+ qwik: QwikCompiler,
};
// src/core/loader.ts
@@ -277,8 +302,7 @@ function normalizeIconPath(path) {
return path.replace(iconPathRE, URL_PREFIXES[0]);
}
function resolveIconsPath(path) {
- if (!isIconPath(path))
- return null;
+ if (!isIconPath(path)) return null;
path = path.replace(iconPathRE, "");
const query = {};
const queryIndex = path.indexOf("?");
@@ -288,8 +312,7 @@ function resolveIconsPath(path) {
new URLSearchParams(queryRaw).forEach((value, key) => {
if (key === "raw")
query.raw = value === "" || value === "true" ? "true" : "false";
- else
- query[key] = value;
+ else query[key] = value;
});
}
path = path.replace(/\.\w+$/, "");
@@ -297,7 +320,7 @@ function resolveIconsPath(path) {
return {
collection,
icon,
- query
+ query,
};
}
async function generateComponent({ collection, icon, query }, options) {
@@ -309,7 +332,7 @@ async function generateComponent({ collection, icon, query }, options) {
customCollections,
iconCustomizer: providedIconCustomizer,
transform,
- autoInstall = false
+ autoInstall = false,
} = options;
const iconifyLoaderOptions = {
addXmlNs: false,
@@ -323,30 +346,36 @@ async function generateComponent({ collection, icon, query }, options) {
customizations: {
transform,
async iconCustomizer(collection2, icon2, props) {
- await (providedIconCustomizer == null ? void 0 : providedIconCustomizer(collection2, icon2, props));
+ await (providedIconCustomizer == null
+ ? void 0
+ : providedIconCustomizer(collection2, icon2, props));
Object.keys(query).forEach((p) => {
const v = query[p];
- if (p !== "raw" && v !== void 0 && v !== null)
- props[p] = v;
+ if (p !== "raw" && v !== void 0 && v !== null) props[p] = v;
});
- }
- }
+ },
+ },
};
- const svg = await _nodeloader.loadNodeIcon.call(void 0, collection, icon, iconifyLoaderOptions);
- if (!svg)
- throw new Error(`Icon \`${warn}\` not found`);
+ const svg = await _nodeloader.loadNodeIcon.call(
+ void 0,
+ collection,
+ icon,
+ iconifyLoaderOptions,
+ );
+ if (!svg) throw new Error(`Icon \`${warn}\` not found`);
const _compiler = query.raw === "true" ? "raw" : options.compiler;
if (_compiler) {
- const compiler = typeof _compiler === "string" ? compilers[_compiler] : await _compiler.compiler;
- if (compiler)
- return compiler(svg, collection, icon, options);
+ const compiler =
+ typeof _compiler === "string"
+ ? compilers[_compiler]
+ : await _compiler.compiler;
+ if (compiler) return compiler(svg, collection, icon, options);
}
throw new Error(`Unknown compiler: ${_compiler}`);
}
async function generateComponentFromPath(path, options) {
const resolved = resolveIconsPath(path);
- if (!resolved)
- return null;
+ if (!resolved) return null;
return generateComponent(resolved, options);
}
@@ -363,11 +392,15 @@ var unplugin = _unplugin.createUnplugin.call(void 0, (options = {}) => {
const queryIndex = normalizedId.indexOf("?");
const res = `${(queryIndex > -1 ? normalizedId.slice(0, queryIndex) : normalizedId).replace(/\.\w+$/i, "").replace(/^\//, "")}${queryIndex > -1 ? `?${normalizedId.slice(queryIndex + 1)}` : ""}`;
const resolved2 = resolveIconsPath(res);
- const compiler = ((_a = resolved2 == null ? void 0 : resolved2.query) == null ? void 0 : _a.raw) === "true" ? "raw" : options.compiler;
+ const compiler =
+ ((_a = resolved2 == null ? void 0 : resolved2.query) == null
+ ? void 0
+ : _a.raw) === "true"
+ ? "raw"
+ : options.compiler;
if (compiler && typeof compiler !== "string") {
const ext = compiler.extension;
- if (ext)
- return `${res}.${ext.startsWith(".") ? ext.slice(1) : ext}`;
+ if (ext) return `${res}.${ext.startsWith(".") ? ext.slice(1) : ext}`;
} else {
switch (compiler) {
case "astro":
@@ -393,23 +426,21 @@ var unplugin = _unplugin.createUnplugin.call(void 0, (options = {}) => {
},
async load(id) {
const config = await resolved;
- const code = await generateComponentFromPath(id, config) || null;
+ const code = (await generateComponentFromPath(id, config)) || null;
if (code) {
return {
code,
- map: { version: 3, mappings: "", sources: [] }
+ map: { version: 3, mappings: "", sources: [] },
};
}
},
rollup: {
api: {
- config: options
- }
- }
+ config: options,
+ },
+ },
};
});
var src_default = unplugin;
-
-
exports.src_default = src_default;
from unplugin-icons.
Related Issues (20)
- ID collisions in astro HOT 1
- `resolveId` doesn't work as expected when query params contains `.`s HOT 1
- components.d.ts path error if the name startswith prefix defined in collections HOT 6
- Vue 2 examples won't run
- Events don't fire in Vue 2 HOT 5
- How to use the icon's raw svg as url(data:....) in css? HOT 5
- How to auto import unplugin-icons ? HOT 1
- How to auto import icon set with plural names? HOT 7
- Symptom When the icon is imported automatically, an error message is displayed indicating that the icon version does not match
- Unable to use ?raw in SvelteKit HOT 3
- Svelte 5 runes mode not working HOT 4
- Qwik type definitions are not exported in package.json HOT 1
- I import icons dynamically in Svelte? HOT 1
- About icon aspect ratio
- Vue error when using vue-tsc - Type '{}' is not assignable to type 'ComponentProps<string>' HOT 7
- An issue for vue2(<2.7) compiler with "transpile is not a function" HOT 9
- Slow Performance with Svelte 5 HOT 10
- Support for Yarn PnP HOT 5
- Type error when add custom Iconify IconSet customCollections
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from unplugin-icons.