プロジェクトのルートディレクトリから、 import UserHistory from '@/lib/components/createSettings/UserHistory のように、 @ でプロジェクトルートからの絶対パスで import するまでの手順です。
../../../Hoge.tsx のように、 ../ をたくさん書かなくてよくなります。
tsconfig.json の設定
プロジェクトのルートディレクトリを起点にする場合は、以下のようにします。
tsconfig.json
{
"extends": "expo/tsconfig.base",
"compilerOptions": {
"experimentalDecorators": true,
"strictPropertyInitialization": false,
"emitDecoratorMetadata": true,
"strict": true,
"baseUrl": ".",
"paths": {
"@/*": ["./*"]
}
}
}
babel.conig.js の設定
babel.config.js
module.exports = function (api) {
api.cache(true);
return {
presets: ['babel-preset-expo'],
plugins: [
'react-native-paper/babel',
[
'module-resolver',
{
alias: {
'@': './', // プロジェクトのルートディレクトリを指します
},
},
],
],
};
};src をルートディレクトリとする例は以下のような記事が参考になります。