Skip to content

Support SolidJS 2.0, modernize package exports and add Vite optimizer - #77

Open
x64Bits wants to merge 7 commits into
mainfrom
feat/2.0
Open

x64Bits wants to merge 7 commits into
mainfrom
feat/2.0

Conversation

@x64Bits

@x64Bits x64Bits commented Nov 3, 2026

Copy link
Copy Markdown
Owner

Summary

This PR adds official support for SolidJS 2.0 (while retaining full backward compatibility with Solid 1.x), modernizes our build and package exports for modern bundlers, and introduces an optional Vite plugin for instant dev-server performance.

It also addresses the performance goals discussed in #25 and explored by @aminya in #28 (eliminating client-side innerHTML overhead and resolving bundler compilation lag). Instead of emitting 35,000+ individual precompiled component files to npm (which bloats package size and install times), we achieve high runtime performance and instant dev startup while preserving the library's existing clean API (import { IconName } from "solid-icons/<pack>").


Key Changes

  1. SolidJS 2.0 & Universal Runtime

    • Updated IconTemplate to cleanly support Solid 2.0's reactive prop spreading and signal getters, while maintaining identical behavior in Solid 1.x.
    • Client-side icon rendering uses cached template fragments (cloneNode), avoiding repeated HTML parsing while keeping SSR hydration straightforward.
  2. Modern Package Exports

    • Configured conditional exports in package.json (".", "./lib", "./vite", "./*") with solid, import, types, and default conditions, ensuring seamless resolution in Vite, Astro, and modern TypeScript (moduleResolution: "bundler" / "node16").
  3. Vite Optimizer Plugin (solid-icons/vite)

    • Added an optional Vite plugin that intercepts pack imports in dev mode (e.g. import { FaSolidHeart } from "solid-icons/fa") and resolves only the requested icons on the fly.
    • Eliminates the need for Vite to scan or pre-bundle full icon packages during vite dev, resulting in near-instant cold starts without requiring users to switch to individual file import paths.
  4. Ionicons SVGO Stroke Fix

    • Added NORMALIZE_PACK.IO to preserveStrokeConfig in our SVGO optimization pipeline. This prevents removeAttributesBySelector and removeUselessStrokeAndFill from accidentally stripping stroke-width and stroke-linejoin from outline icons.
  5. Multi-Version E2E Test Suite

    • Introduced an automated Playwright test suite that verifies rendering and runtime reactivity (signal-driven color/size/visibility updates) across:
      • Solid 1.7, 1.8, 1.9 (dev and build)
      • Solid 2.0-rc (dev and build)
      • Astro with Solid integration (dev and build)
    • All 10 E2E scenarios and all 10,027 unit tests pass cleanly.

Usage Example

Standard usage remains unchanged:

import { TbBrandSolidjs } from "solid-icons/tb";

<TbBrandSolidjs size={24} color="#2c4f7c" />

To enable the Vite optimization in dev:

// vite.config.ts
import { defineConfig } from "vite";
import solid from "vite-plugin-solid";
import { solidIcons } from "solid-icons/vite";

export default defineConfig({
  plugins: [solid(), solidIcons()],
});

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant