{"componentChunkName":"component---src-templates-post-template-js","path":"/posts/set-up-path-aliases-in-nodejs","result":{"data":{"markdownRemark":{"id":"7996da32-a203-51ff-b9e3-761f5b6f4fdd","html":"

Dạo gần đây mình đang code 1 pet project sử dụng nodejs ở back-end, vừa để tự học thêm trong thời gian rảnh vừa khỏi quên kiến thức, thì gặp phải 1 vấn để rất nhức nhối liên quan đến đường dẫn (path) mà có thể anh em đã gặp phải nhiều rồi…

\n
import { saveUser } from '../../../../../models/User'\nimport homeController from '../../../../../controllers/home'
\n

Code này hẳn đã khiến nhiều anh em đau đầu khi không thể biết được cần phải đi ra, đi vào bao nhiêu folder để tìm đúng file mong muốn 😭😭, nếu chẳng may cần chuyển chỗ 1 folder thì sẽ phải update lại path ở tất cả những file import module đó 😤

\n

Nhưng nếu chúng ta có thể định nghĩa alias (hiểu đơn giản là shortcut) cho những module thường xuyên phải import trong toàn bộ project thì sao?

\n

Ví dụ như này:

\n
import { saveUser } from '@models/User'\nimport homeController from '@controllers/home'
\n

Trong đó:

\n\n

Giải pháp hoàn toàn đơn giản với module-alias và config tsconfig.json. Anh em làm theo hướng dẫn để set up nhé

\n

Update tsconfig.json

\n

Mở file tsconfig.json lên và thêm vào những config sau vào compilerOptions object:

\n
\"compilerOptions\": {\n\t// other configs...\n\t\"baseUrl\": \"./src\",\n\t\"paths\": {\n\t\t\t\"*\": [\n\t\t\t\t\t\"node_modules/*\",\n\t\t\t\t\t\"src/types/*\"\n\t\t\t],\n\t\t\t\"@controllers/*\": [\n\t\t\t\t\t\"controllers/*\"\n\t\t\t],\n\t\t\t\"@models/*\": [\n\t\t\t\t\t\"models/*\"\n\t\t\t]\n\t}\n}
\n

Trong đó @controllers hay @models chính là alias cho module của các bạn (có thể dùng bất cứ naming convention nào tùy ý, không cần thiết phải chứa @ ở đầu, đó chỉ là prefix mình dùng để dễ phân biệt thôi)

\n

Bây giờ bạn hoàn toàn có thể sử dụng alias đã config trong project rồi, nhưng JS sẽ không resolve được module import với lỗi sau

\n
\n

[Node] Error: Cannot find module ‘@models/User’

\n
\n

Cài đặt module-alias package

\n

Module này sẽ giúp resolve các path alias trong file JS sau khi biên dịch

\n\n

🎉🎉🎉 Done

\n

Bây giờ anh em chỉ cần reload IDE, start project và có thể xài alias thoải mái rồi nhé.

\n

\"VS

\n

VS Code support luôn tính năng này bằng cách đọc file tsconfig.json, chỉ cần reload lại là được.

\n

Chúc anh em thành công!

\n

Tham khảo

\n","fields":{"slug":"/posts/set-up-path-aliases-in-nodejs","tagSlugs":["/tag/alias/","/tag/path-aliases/","/tag/nodejs/","/tag/typescript/","/tag/tsconfig/","/tag/javascript/"]},"frontmatter":{"date":"2020-08-26T22:12:03.284Z","description":"Nếu như có thể định nghĩa alias (hiểu đơn giản là shortcut) cho những module mà chúng ta thường xuyên phải import trong toàn bộ project thì code sẽ đơn giản như thế nào... ","tags":["alias","path-aliases","nodejs","typescript","tsconfig","javascript"],"title":"Set up path aliases trong Node.js + Typescript","socialImage":"/media/road.jpg","headerImage":"/media/road.jpg"},"timeToRead":3}},"pageContext":{"slug":"/posts/set-up-path-aliases-in-nodejs"}}}