久々にAngularでイチからアプリを作り始め躓いたことをメモ。
assetsでcolors.scssファイルを作ってどのscssファイルからでも呼べるように設定。
これらをimportで読み込む時にパスを設定するのですが。
コンポーネントツリーが深いと ../../../... みたいになるのでコンポーネントを新規で作ったり、移動した時にまた修正するとなるので ~/assets でルートを設定して読み込みたい。
(って先輩方の作ってきたAngularがそう設定してたので参考に)
いざ、コピペで ~/assets で設定したら
そんなパスねぇよ！！！！
って怒られた。。(´・ω・`) そんなぁ
ってどう設定しているのがぐぐってみたらありました。
ts.config.json の設定でした。
“baseUrl”: “/”
の / を src に変える
“baseUrl”: “src”
にする。
とすると src が基準になり ~ でルートディレクトリが示せるので ~/assets で無事に読み込まれました！
後は
"paths": {
"@app/*": [
"app/*"
],
"@shared/*": [
"app/shared/*"
],
}
で作成したコンポーネントやモジュールのパスも設定すると @app/ でコンポーネント設定も簡単に出来ます。
久々にAngular触ったけど簡単なモック作るのにすごく簡単だなーと改めて実感。
今回初めて、他のデザイナーさんからもらったカンプでコンポーネント分割をしたのですがこりゃまた難しい。
コンポーネントを考えてデザインを考える大切さを実装して実感。。。エンジニアさん今までごめんなさい、そして感謝！！！
