使用niucloud-admin开源项目运行APP环境报错:,Invalid value “iife“ for option “output.format“ - UMD and IIFE outp
在使用开源项目niucloud-admin的uni-app前端项目是,发现H5和小程序都可以正常运行,使用HBuilderX运行到手机模拟器中就会出现报错

Invalid value "iife" for option "output.format" - UMD and IIFE output formats are not supported for code-splitting builds.
后面查询资料发现如果项目在存在这个报错原因可能是
-
vite.config.js配置问题:- 在 vite.config.js 中,
rollupOptions.output.format被设置为iife或umd,但代码分割未被禁用。
- 在 vite.config.js 中,
-
动态导入(
import())的使用:- 如果代码中使用了动态导入(
import()),会触发代码分割,而iife和umd格式不支持代码分割。
- 如果代码中使用了动态导入(
-
插件修改了
output.format:- 某些插件(如
@dcloudio/vite-plugin-uni或其他自定义插件)可能会修改rollupOptions.output.format,导致冲突。
- 某些插件(如
1和3我都按照网上的资料进行配置了还是没有效果,然后我就在项目里面查询有没有动态导入
我通过文件查找的方式查到了在src/locale/language.ts和src/utils/interceptor.ts文件中使用 await import 动态导入,它使用的路径是../我把他替换为@路径就可以了
运行起来后发现项目有提示报错,因为找不到currentParam这个东西导致页面白屏,这个东西写在src/utils/common.ts文件里面
// 获取分享路由
export const currShareRoute = () => {
const pages = getCurrentPages()
if (pages.length == 0) {
return {
path: '/',
params: {}
}
}
let currentRoute = pages[pages.length - 1].route //获取当前页面路由
// #ifdef H5
let currentParam = pages[pages.length - 1].$page.options; //获取路由参数
// #endif
// #ifdef MP
let currentParam = pages[pages.length - 1].options || {}; //获取路由参数
// #endif
// 拼接参数
let params = {};
for (let key in currentParam) {
params[key] = currentParam[key]
}
let currentPath = '/' + currentRoute;
return {
path: currentPath,
params: params
}
}
他们没有对APP运行环境添加这个变量,自己手动给他修改一下就可以了
// 获取分享路由
export const currShareRoute = () => {
const pages = getCurrentPages()
if (pages.length == 0) {
return {
path: '/',
params: {}
}
}
let currentRoute = pages[pages.length - 1].route //获取当前页面路由
// #ifdef H5
let currentParam = pages[pages.length - 1].$page.options; //获取路由参数
// #endif
// #ifdef MP
let currentParam = pages[pages.length - 1].options || {}; //获取路由参数
// #endif
// #ifdef APP //新增APP运行环境
let currentParam = pages[pages.length - 1].options || {}; //获取路由参数
// #endif
// 拼接参数
let params = {};
for (let key in currentParam) {
params[key] = currentParam[key]
}
let currentPath = '/' + currentRoute;
return {
path: currentPath,
params: params
}
}
然后页面就可以正常显示了,APP打包成APk后再request里面的baseUrl好像找不到,我在打包的时候编译了一个APP环境下默认把baseUrl=‘https.xxxx.com’赋值了
这个是我修改的文件路径

页面在跳转登陆的时候又会报一个错误 TypeError: path.replace(...).replaceAll is not a function
应为我本地的es环境不是es12的没有这个方法,replaceAll 是 ES2021(ES12)中引入的一个字符串方法,用于替换所有匹配的子字符串。如果你的运行环境或构建工具不支持 ES2021,则会报这个错误。
所以我把他修改为下面这种格式
path.replace(/^\//, '').replace(/\//g, '.');
修改的文件夹在 src/locale/language.ts这里

修改APP图标中不显示问题,原因很简单,因为在项目中没有引入的如今没有指定https请求,可能导致APP环境在找不到这个icon文件导致在APP中图标失效,修改方法很简单在引入的地址的前方添加https:前缀就可以了,引入文件的目录在src/styles/iconfonts.css || src/styles/offcial-iconfonts.css这两个文件里面


希望可以给遇到这个问题的伙伴一点参考,欢迎在评论区交流,谢谢
DAMO开发者矩阵,由阿里巴巴达摩院和中国互联网协会联合发起,致力于探讨最前沿的技术趋势与应用成果,搭建高质量的交流与分享平台,推动技术创新与产业应用链接,围绕“人工智能与新型计算”构建开放共享的开发者生态。
更多推荐



所有评论(0)