Vite + React で path alias を使いたい！ - かもメモ
前回までのあらすじ npm create vite コマンドでサクッと Vite + React (TypeScript) のプロジェクトが作れました！ SPA はファイルがたくさんになるので import の際に ../../../ HELL になりがちです。これを回避するためにパスエイリアス(path alias)を設定しておきたいお気持ちに溢れます。 結論: vite-tsconfig-paths を使えば楽ちん vite-tsconfig-pathsを使えば tsconfig.json にパスエイリアス設定を作成するだけで済む。 $ npm i -D vite-tsconfig-paths vite.config.ts import { defineConfig } from 'vite' + import tsconfigPaths from 'vite-tsconfig-pat
Webpackのresolve.aliasとVSCodeのjsconfig.jsonを使ってimportを快適にする - Qiita
import { someConstant } from './../../config/constants' import MyComponent from './../../../components/MyComponent' import { myActionCreator } from './../../../ducks/someReducer' いちいちターゲットのファイルとインポート先のファイルの相対パスを確認する必要があってめちゃくちゃ面倒ですよね。そこで今回はwebpackのresolve.aliasとjsconfig.jsonを使って↑のコードを import { someConstant } from '@config/constants' import MyComponent from '@components/MyComponent' import { myActi
Next.js+TypeScriptでimportのaliasを設定するのが楽になっていた - RX100で撮り歩くブログ
importするときに何もしていないと以下のように相対パスで書きますが、階層が深くなると面倒です。 import { Button } from '../../components/Button それを以下のように書けるようにします。 import { Button } from '@/components/Button Next.jsでは以前はパッケージを追加して、next.config.jsをつくって設定を書く必要がありました。しかし、v9.4からtsconfig.jsonに書き足すだけでOKになったようです。 nextjs.org 上記のサイトに書いてあるようにtsconfig.jsonのcompilerOptionsに追加するだけです。@から始めたい場合は以下のように書きます。 { "compilerOptions": { "baseUrl": ".", "paths": { "@
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
TypeScript + Gatsby + Storybook環境でimport aliasを利用する | tamalog
