Cracoを使ってsrc配下を@/で指定する。

Reactのimportで @/hogehoge と指定したいだけなのにハマったのでメモ。

Module not found: Error: Can't resolve '@/hogehoge

Cracoを利用することで解消しました。 www.npmjs.com

以下の2か所でパスを指定します。

• tsconfig.json
• craco.config.js

tsconfig.json

    "paths": {
      "@/*": ["./src/*"]
    }

craco.config.js

const path = require('path');
module.exports = {
  webpack: {
    alias: {
      '@': path.resolve(__dirname, 'src'),
    },
  },
  style: {
    postcss: {
      plugins: [],
    },
  },
};