frontend icon indicating copy to clipboard operation
frontend copied to clipboard

Coding standard: Import statements using mixed relative & absolute path

Open jetkan-yk opened this issue 5 years ago • 0 comments

Currently we have an iron rule of using relative import paths, which creates some unnecessarily long paths: import { AchievementItem } from '../../../../../../features/achievement/AchievementTypes'; could have been: import { AchievementItem } from 'src/features/achievement/AchievementTypes'; Besides, all import paths need to be updated everytime a file is moved to a different directory. This happens quite frequently when implementing a new feature.

I'm proposing a new standard for import statements:

Imports that have >= 3 levels of common root path should use relative path. Otherwise use absolute path.

File: src/pages/achievement/dashboard/Dashboard.tsx Import paths with prefix src/page/achievement/... use relative, otherwise use absolute e.g.

Import: src/pages/achievement/dashboard/subcomponents/AchievementTask.tsx -> use relative ./subcomponents/AchievementTask.tsx Import: src/pages/achievement/Achievement.tsx -> use relative ../Achievement.tsx Import: src/pages/academy/game/Game.tsx -> use absolute Import: src/common/utils/Constants.ts -> use absolute

jetkan-yk avatar Jul 20 '20 06:07 jetkan-yk