我希望能够在使用jest时使用webpack别名来解析导入,并且最好参考webpack.aliases
以避免重复。
是conf:
"jest": {
"modulePaths": ["src"],
"moduleDirectories": ["node_modules"],
"moduleNameMapper": {
"^@shared$": "<rootDir>/shared/",
"^@components$": "<rootDir>/shared/components/"
}
},
Webpack别名:
exports.aliases = {
'@shared': path.resolve(paths.APP_DIR, 'shared'),
'@components': path.resolve(paths.APP_DIR, 'shared/components'),
};
进口:
import Ordinal from '@shared/utils/Ordinal.jsx';
import Avatar from '@components/common/Avatar.jsx';
由于某种原因,@
导致了问题,因此将其删除(使用别名和导入)时,可以找到shared
但components
仍然无法解决。
FAIL src/shared/components/test/Test.spec.jsx
● Test suite failed to run
Cannot find module '@shared/utils/Ordinal.jsx' from 'Test.jsx'
我尝试使用jest-webpack-alias,babel-plugin-module-resolver和Jest / Webpack docs
这似乎已解决。
以下是有效的设置:
版本号
"jest": "~20.0.4"
"webpack": "^3.5.6"
package.json
"jest": {
"moduleNameMapper": {
"^@root(.*)$": "<rootDir>/src$1",
"^@components(.*)$": "<rootDir>/src/components$1",
}
}
webpack.shared.js
const paths = {
APP_DIR: path.resolve(__dirname, '..', 'src'),
};
exports.resolveRoot = [paths.APP_DIR, 'node_modules'];
exports.aliases = {
'@root': path.resolve(paths.APP_DIR, ''),
'@components': path.resolve(paths.APP_DIR, 'components'),
};
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句