使用组件路径从NPM包导入

xzlaal3s 于 2023-04-12 发布在其他

关注(0)|答案(1)|浏览(160)

使用Material UI时，我可以通过两种方式导入模块：

import { Box } from '@mui/material';
// or
import Box from '@mui/material/Box';

我查看了他们的源代码here，我注意到他们的项目结构如下

/mui-material
  | package.json
  | tsconfig.json
  / src
    | <components>
    | index.js

（为了不丢失大图，我跳过了一些文件）
我一直在以类似的方式构建我的个人npm包。我成功地将其推送到我的NPM feed，但当我从另一个项目使用它时，我可以通过以下方式导入它：

import { MyModule } from '@la27/utils';
// or
import MyModule from '@la27/utils/src/MyModule';

我怎样才能改变它，使我不需要使用“src”部分？

1条答案

您应该在utils目录中创建index.js文件，并导出index.js文件中的组件，如下所示：

// this is the example for Material UI's Box component. Change it accordingly:
export { default as Box } from './Box';
export * from './Box';

在此处引用Material UI自己的index.js文件：https://github.com/mui/material-ui/blob/master/packages/mui-material/src/index.js
Upvote将不胜感激，如果这是有帮助的！