如何正确为NPM模块打包资源?Vite导入SVG资源报错求助
npm包非JS资源导入的Vite兼容问题
我开发了一个名为my-lib的库,打包后的JS文件及类型声明存放在/dist目录,SVG资源存放在/assets目录,完整目录结构如下:
my-lib ├── assets │ ├── a.svg │ ├── b.svg ├── dist │ ├── index.d.ts │ ├── index.mjs │ ├── index.umd.js ├── LICENSE ├── package.json
我的需求是:JS模块从包根目录my-lib导出,SVG资源允许通过my-lib/assets路径导入(需配合对应框架与打包器插件,比如React+Vite环境下使用vite-plugin-svgr)。
这种导入方式在create-react-app+Webpack项目中可以正常使用(通过import { ReactComponent as A } from "my-lib/assets/a.svg";导入,并配置了合适的TypeScript声明文件),但在Vite项目中会报错:
[vite] Internal server error: Missing "./assets/a.svg" export in "my-lib" package
当前package.json的关键配置如下:
// package.json { "main": "./dist/index.umd.js", "module": "./dist/index.mjs", "types": "./dist/index.d.ts", "files": [ "./dist", "./assets" ], // ...其他配置 }
请问:
package.json中是否存在针对非JS资源的特定配置字段?- 这个问题是否仅属于打包器的配置问题?
内容的提问来源于stack exchange,提问作者tobiasfried
相关产品推荐
相关产品推荐

