前端该怎么引入模块文件
现在前端开发都在使用模块化,组建化,在开发实践中经常为引入模块的路径犯迷糊,不知道到底该使用相对路径,还是绝对路径,还是直接引用npm 包名,最近看《TypeScript Deep Dive》的一章解决了我的困惑。
先说结论,如果是引用自己写的组件或模块,就用相对路径,如果是npm 包,直接引用包名就好了。第一种尽量不用
有2中不同类型的模块,相对路径模块,动态查找的模块
1.相对路径模块
import foo from './foo' 在当前文件夹下查找foo 文件
import bar from '../bar' 在上个文件夹中查找bar
import bar from '../someFolder/bar'
2.动态查找模块
如果这种声明引入模块 import foo from 'foo' 会查找以下路径:
./node_modules/foo
../node_modules/foo
../../node_modules/foo
直到文件系统的根目录
3.查找文件的顺序
当找到文件的位置,接下来是查找文件,比如 foo
如果 foo.ts 存在 ,成功,停止
如果 foo 是一个文件夹,有一个foo/index.ts 存在,成功
如果foo 是一个文件夹,有一个foo/package.json 存在,package.json中声明 types 键存在,成功
如果package.json 声明main 键值存在,成功。