vite-plugin-svgr 0.6.0 → 1.1.0

package/lib/index.d.ts

@@ -1,7 +1,9 @@
 import type { Config } from '@svgr/core';
+import { transformWithEsbuild } from 'vite';
 import type { Plugin } from 'vite';
 declare type Options = {
     svgrOptions?: Config;
+    esbuildOptions?: Parameters<typeof transformWithEsbuild>[2];
 };
-declare const _default: (options?: Options) => Plugin;
+declare const _default: ({ svgrOptions, esbuildOptions, }?: Options) => Plugin;
 export = _default;

package/lib/index.js

@@ -23,8 +23,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 const fs_1 = __importDefault(require("fs"));
 const vite_1 = require("vite");
-module.exports = function svgrPlugin(options = {}) {
-    const { svgrOptions = {} } = options;
+module.exports = function svgrPlugin({ svgrOptions, esbuildOptions, } = {}) {
     return {
         name: 'vite:svgr',
         async transform(code, id) {
@@ -33,10 +32,11 @@ module.exports = function svgrPlugin(options = {}) {
                 const svgCode = await fs_1.default.promises.readFile(id, 'utf8');
                 const componentCode = await convert(svgCode, svgrOptions, {
                     componentName: 'ReactComponent',
+                    filePath: id,
                 }).then((res) => {
                     return res.replace('export default ReactComponent', `export { ReactComponent }`);
                 });
-                const res = await (0, vite_1.transformWithEsbuild)(componentCode + '\n' + code, id, { loader: 'jsx' });
+                const res = await (0, vite_1.transformWithEsbuild)(componentCode + '\n' + code, id, Object.assign({ loader: 'jsx' }, esbuildOptions));
                 return {
                     code: res.code,
                     map: null, // TODO:

package/package.json

@@ -1,13 +1,8 @@
 {
   "name": "vite-plugin-svgr",
-  "version": "0.6.0",
+  "version": "1.1.0",
   "description": "Vite plugin to transform SVGs into React components",
   "main": "lib/index.js",
-  "scripts": {
-    "dev": "tsc --watch",
-    "build": "tsc",
-    "prepublish": "npm run build"
-  },
   "repository": "pd4d10/vite-plugin-svgr",
   "files": [
     "lib",
@@ -20,14 +15,19 @@
   "author": "Rongjian Zhang",
   "license": "MIT",
   "devDependencies": {
-    "@types/node": "^16.11.6",
-    "typescript": "^4.4.4",
-    "vite": "^2.6.13"
+    "@types/node": "^17.0.8",
+    "typescript": "^4.5.4",
+    "vite": "^2.7.10"
   },
   "peerDependencies": {
     "vite": "^2.6.0"
   },
   "dependencies": {
-    "@svgr/core": "^6.0.0-alpha.3"
-  }
-}
+    "@svgr/core": "^6.2.0"
+  },
+  "scripts": {
+    "dev": "tsc --watch",
+    "build": "tsc"
+  },
+  "readme": "# vite-plugin-svgr\n\n[![npm](https://img.shields.io/npm/v/vite-plugin-svgr.svg)](https://www.npmjs.com/package/vite-plugin-svgr)\n\nVite plugin to transform SVGs into React components. Uses [svgr](https://github.com/gregberge/svgr) under the hood.\n\n## Usage\n\n```js\n// vite.config.js\nimport svgrPlugin from 'vite-plugin-svgr'\n\nexport default {\n  // ...\n  plugins: [\n    svgrPlugin({\n      svgrOptions: {\n        icon: true,\n        // ...svgr options (https://react-svgr.com/docs/options/)\n      },\n    }),\n  ],\n}\n```\n\nThen SVG files can be imported as React components, just like [create-react-app](https://create-react-app.dev/docs/adding-images-fonts-and-files#adding-svgs) does:\n\n```js\nimport { ReactComponent as Logo } from './logo.svg'\n```\n\nIf you are using TypeScript, `vite-plugin-svgr/client` can be added to `tsconfig.json`:\n\n```json\n{\n  // ...\n  \"compilerOptions\": {\n    // ...\n    \"types\": [\"vite-plugin-svgr/client\"]\n  }\n}\n```\n\n## License\n\nMIT\n"
+}