简体中文
uni-app vue3
和 uni-app x (HBuilderX 4.25+)
项目支持引入 json
文件。
js | ts | uts
文件或 script
标签内引入 json
文件时,可以使用相对路径或绝对路径,例如:
// 绝对路径,@指向项目根目录,在cli项目中@指向src目录
import pagesJson from '@/pages.json';
// 相对路径
import pagesJson from '../../common/pages.json';
导入 json
文件时支持解构,此时会根据导入内容进行摇树,减小包体积,例如:
import { pages } from '@/pages.json';
导入的 json
文件内部支持条件编译, 导入的结果是根据条件编译规则进行处理后的结果,以如下 json
文件为例:
{
"pages": [{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "index"
}
},
// #ifdef APP
{
"path": "pages/index/app",
"style": {
"navigationBarTitleText": "app"
}
},
// #endif
// #ifdef H5
{
"path": "pages/index/web",
"style": {
"navigationBarTitleText": "web"
}
}
// #endif
],
"globalStyle": {
"navigationBarTextStyle": "black",
"navigationBarTitleText": "uni-app",
"navigationBarBackgroundColor": "#F8F8F8",
"backgroundColor": "#F8F8F8"
},
"uniIdRouter": {}
}
在 App
平台导入的结果中,pages
下只包含 path
为 pages/index/index
和 pages/index/app
的对象。
在 Web
平台导入的结果中,pages
下只包含 path
为 pages/index/index
和 pages/index/web
的对象。