使用vue3创建项目用webview加载另一个vue3的项目报错白屏 Unexpected token import，Uncaught SyntaxError: Unexpected token .
合肥前端小菜鸡
- 发布：2024-08-20 11:32
- 更新：2024-09-26 17:15
- 阅读：340
合肥前端小菜鸡 (作者)
<template>
<view>
<view style="height: 100rpx;"> </view>
<web-view :webview-styles="webviewStyles" :style="{width:'100vw',}" :src="webviewUrl"
@message="handleMessage"></web-view>
</view>
</template>
<script lang="ts" setup>
import { ref, onMounted } from 'vue';
import { onLoad, onReady } from '@dcloudio/uni-app';
import { tnNavBack } from '@/uni_modules/tuniaoui-vue3/utils'
const webviewStyles = ref({
top: 20,
height:null
})
const getEnv = () => {
// #ifdef MP-WEIXIN
return 'MP-WEIXIN'
// #endif
// #ifdef APP-PLUS
return 'APP-PLUS'
// #endif
// #ifdef H5
return 'H5'
// #endif
}
const handleMessage = (e) => {
let action = ''
// #ifdef H5
action = e.data?.type || 'Back'
// #endif
// #ifdef APP-PLUS
action = e.detail?.data?.[0]?.type || 'Back'
// #endif
if (action === 'Back') {
navigateBack()
}
}
const navigateBack = () => {
tnNavBack()
}
// 获取屏幕信息
const getSystemInfo = () => {
uni.getSystemInfo({
success: ({
screenHeight,
statusBarHeight
}) => {
webviewStyles.value.top = statusBarHeight
webviewStyles.value.height = screenHeight - statusBarHeight
}
});
}
const baseUrl = `http://192.168.1.10:8082/tk/#`
const pageUrl = `pages/index/index`
// const webviewUrl = ref(`http://192.168.1.10:5174/tlpdf#/pages/index/index?obj=${JSON.stringify(obj)}`)
const webviewUrl = ref()
onLoad((options) => {
const externalObj = JSON.parse(options.obj)
// #ifdef H5
window.onmessage = handleMessage
// #endif
// #ifdef APP-PLUS | MP-WEIXIN
getSystemInfo()
// #endif
// webviewUrl
// 携带的数据
const obj = {
...externalObj,
env: getEnv(),
}
console.log(obj, '-------obj');
webviewUrl.value = `${baseUrl}${pageUrl}?obj=${JSON.stringify(obj)}`
})
</script>
<style lang="scss" scoped>
.page {}
</style>-
-
合肥前端小菜鸡 (作者)
回复 DCloud_UNI_yuhe: 刚刚测试了不是这个问题 只要是vue3用webview加载uniapp的vue3项目就白屏报错 你可以测试一下
2024-08-21 11:31
-
-
合肥前端小菜鸡 (作者)
回复 DCloud_UNI_yuhe: 报错信息：Unexpected token import，Uncaught SyntaxError: Unexpected token .在HBuilder控制台报的 页面白屏不显示如何东西
2024-08-21 13:55
-
-
合肥前端小菜鸡 (作者)
回复 DCloud_UNI_yuhe: 这个都尝试了 就是webview的问题 对了之前说的这种情况只有在uniapp运行app的时候白屏 小程序和H5都是正常的
2024-08-22 09:35
-
-
合肥前端小菜鸡 (作者)
回复 DCloud_UNI_yuhe: 你好 前段时间没注意到 这边已经上传复现demo 麻烦看一下 针对这种不支持的机型后续会兼容吗？ 如果不会兼容请回复一下 我们后续还是使用vue2开发webview项目
2024-08-30 14:31
-
合肥前端小菜鸡 (作者)
这是复现dome 我已经定位到问题 这个现象会在安卓手机上出现 并且在版本较低的必现 我借遍了公司所有安卓手机 目前发现安卓8.1版本会出现这个情况 高版本不会出现 因为公司安卓手机较少无法复测更多机型 测试机复现信息：OPPO R11s 安卓版本8.1.0 处理器高通 运行内存4G
合肥前端小菜鸡 (作者)
没有发布webview链接 我测试了只要是vue3加载vue3的webview链接就报错白屏 新建的项目都这样 麻烦解决回复一下
2024-08-20 18:34
DCloud_UNI_yuhe
回复 合肥前端小菜鸡: 与vue3无关，需要看一下你是咋用的webview
2024-08-20 19:12
合肥前端小菜鸡 (作者)
回复 DCloud_UNI_yuhe: webviwe页面代码已经全部贴在下方了
2024-08-21 09:04