我在 gatsby 的 webpack 配置目录中添加了名为 webpack-plugin 的插件,这使得导入与其父目录同名的文件成为可能。例如,我可以使用路径“components/Link”而不是“components/Link/Link”:
const DirectoryNamedWebpackPlugin = require('directory-named-webpack-plugin');
exports.onCreateWebpackConfig = ({ actions }) => {
actions.setWebpackConfig({
resolve: {
plugins: [new DirectoryNamedWebpackPlugin()],
},
});
};
但不幸的是,当我使用 jest 运行我的测试时,我得到了这样的错误(我也使用绝对导入):
FAIL src/components/atoms/Link/Link.test.js
● Test suite failed to run
Cannot find module 'components/atoms/Icon' from 'src/components/atoms/Link/Link.js'
Require stack:
src/components/atoms/Link/Link.js
src/components/atoms/Link/Link.test.js
3 | import { useAnimation } from 'framer-motion';
4 | import PropTypes from 'prop-types';
> 5 | import Icon from 'components/atoms/Icon';
| ^
6 | import arrow from 'assets/svgs/icon_arrow.svg';
7 | import S from './Link.styles';
8 | import animations from './Link.animations';
at Resolver.resolveModule (node_modules/jest-resolve/build/index.js:307:11)
at Object.<anonymous> (src/components/atoms/Link/Link.js:5:1)
这是我的文件夹结构:
有什么解决办法吗?我是开 Jest 配置的新手。
最佳答案
像这样在每个文件夹中使用 index.js
并完全忘记 DirectoryNamedWebpackPlugin
import Link from './Link';
export default Link;
https://stackoverflow.com/questions/63764004/
相关文章:
reactjs - reactstrap Collapse 没有出现在手机上
api - Google Scripts 应用程序和 Plaid 链接身份验证
ios - 使用共享的 iOS Keychain 启用跨应用程序 Firebase 身份验证
python - 在 Web 应用中使用 SAML 实现 Azure AD 身份验证
python - 在pygame中的数组支持网格中交换颜色的问题
r - “Enter”键不会与 splashR::splash_send_key 一起发送