{"id":22593,"library":"vite-plugin-blocklet","title":"Vite Plugin Blocklet","description":"A Vite library plugin that enhances development of ArcBlock blocklets. Current stable version is 0.14.6. It integrates with Vite 5+ and provides utilities like createBlockletPlugin for Vite config and setupClient for backend Express apps. Key differentiators: it bridges Vite development with ArcBlock's blocklet framework, supports both front-end and back-end projects, and offers flexible configuration via vite.config.js. Release cadence is not documented but appears active. Requires Node.js >=20.","status":"active","version":"0.14.6","language":"javascript","source_language":"en","source_url":null,"tags":["javascript"],"install":[{"cmd":"npm install vite-plugin-blocklet","lang":"bash","label":"npm"},{"cmd":"yarn add vite-plugin-blocklet","lang":"bash","label":"yarn"},{"cmd":"pnpm add vite-plugin-blocklet","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"peer dependency; Vite >=5 is required for the plugin to work","package":"vite","optional":false}],"imports":[{"note":"For Vite config files (ESM context), use import. CommonJS require works in Node.js scripts outside Vite.","wrong":"const createBlockletPlugin = require('vite-plugin-blocklet')","symbol":"createBlockletPlugin","correct":"import { createBlockletPlugin } from 'vite-plugin-blocklet'"},{"note":"For backend scripts (CommonJS), use require. ESM import may work in Node.js with type:module, but examples use CommonJS.","wrong":"import { setupClient } from 'vite-plugin-blocklet'","symbol":"setupClient","correct":"const { setupClient } = require('vite-plugin-blocklet')"},{"note":"The package does not export a default; named exports only. Using default import will result in undefined.","wrong":"const plugin = require('vite-plugin-blocklet')","symbol":"default export","correct":"import plugin from 'vite-plugin-blocklet'"}],"quickstart":{"code":"// vite.config.js\nimport { defineConfig } from 'vite';\nimport react from '@vitejs/plugin-react';\nimport { createBlockletPlugin } from 'vite-plugin-blocklet';\n\nexport default defineConfig(async () => {\n  return {\n    plugins: [react(), createBlockletPlugin()],\n  };\n});","lang":"javascript","description":"Shows how to set up a basic Vite project with React and the blocklet plugin using createBlockletPlugin."},"warnings":[{"fix":"Update Node.js to version 20 or higher.","message":"Requires Node.js >=20.0.0","severity":"breaking","affected_versions":">=0.14.6"},{"fix":"Ensure your project uses Vite 5 or higher.","message":"Peer dependency Vite >=5","severity":"breaking","affected_versions":">=0.14.6"},{"fix":"Use named imports like createBlockletPlugin or setupClient.","message":"No default export; only named exports available","severity":"gotcha","affected_versions":"all"},{"fix":"Add vite-plugin-node-polyfills with protocolImports:true as shown in examples.","message":"Usage without nodePolyfills may cause errors in browser environment","severity":"deprecated","affected_versions":"all"}],"env_vars":null,"last_verified":"2026-04-27T00:00:00.000Z","next_check":"2026-07-26T00:00:00.000Z","problems":[{"fix":"Change to: import { createBlockletPlugin } from 'vite-plugin-blocklet';","cause":"Incorrect import: using default import instead of named import.","error":"TypeError: createBlockletPlugin is not a function"},{"fix":"Use dynamic import() or switch to ESM? For now, use named exports with require? Actually, the package appears to support both, but ensure your script is CommonJS (no type:module).","cause":"Trying to require an ES module in a CommonJS context. The package may be ESM-only in newer versions.","error":"ERR_REQUIRE_ESM: require() of ES Module"},{"fix":"Run: npm install vite@^5","cause":"Vite peer dependency not installed.","error":"Error: Cannot find module 'vite'"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}