uniapp如何打包h5(uniapp怎么打包成微信小程序)

uni-app在打包成h5时,默认是不支持直接打开的,因为打包出来是(/xxx/xxx)这种格式,这点和vue-cli3.0是一致的,在用vue-cll3.0时打包我们会想到在vue.config中配置publicPath,把它配置成(./),但是你在uni-app中是找不到这个文件的,其实在uni官网是有提到publPath,但是说的并不明确(https://uniapp.dcloud.i…

大家好,又见面了,我是你们的朋友全栈君。

  uni-app在打包成h5时,默认是不支持直接打开的,因为打包出来是 (/xxx/xxx)这种格式,这点和vue-cli3.0是一致的,在用vue-cll3.0时打包我们会想到在vue.config中配置publicPath,把它配置成(./),但是你在uni-app中是找不到这个文件的,其实在uni官网是有提到publPath,但是说的并不明确(https://uniapp.dcloud.io/collocation/manifest?id=publicpath

uniapp如何打包h5(uniapp怎么打包成微信小程序)

 

   如果我们想打包成直接浏览的h5,我们需要配置manifest.json这个文件,在其中的h5配置中加入publicPath配置,配置如下:

   uniapp如何打包h5(uniapp怎么打包成微信小程序)

  代码为:

 

	"h5" : {
		"publicPath": "./"
	},

     配置好这个后,以后打包就会生产(./xxx)的引用,这样就可以通过浏览器直接打开而不需要架设成一个服务。但是需要注意的是

      当用css引用图片即backage-image:url(./xxx/xxx.png)这种格式引用图片时,地址需要写出./格式。这样运行和打包都可以找到该图片。但这种的话打包成小程序可能找不到图片,所以当正式使用时最好写成(../../xxx.png)的形式。

 

      当采用src引用时需要写出相对路径即(../../static/xxx.png),但是这样打包后是找不到该图片的,最好通过变量和require(‘../../static/img/java_05.png’) 读取图片。

     

 

 

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/126864.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)
blank

相关推荐

  • 【目录】python全栈工程师

    【目录】python全栈工程师第一阶段:Python语言核心编程1.Python核心–2048游戏核心算法2.面向对象–天龙八部游戏技能系统3.Python高级–集成操作框架项目:2048游戏第二阶段:

  • springboot实战第四章-SpringMVC的文件上传配置

    springboot实战第四章-SpringMVC的文件上传配置

  • React路由基本用法[通俗易懂]

    React路由基本用法[通俗易懂]React路由基本用法1.ReactRouter4.0基本概述:ReactRouter4.0(以下简称RR4)遵循React的设计理念,即万物皆组件。所以RR4只是一堆提供了导航功能的组件(还有若干对象和方法),具有声明式(声明式编程简单来讲就是你只需要关心做什么,而无需关心如何去做,可组合性的特点。RR4采用单代码仓库模型架构(monorepo),这意味者这个仓库里面有…

  • github 京东自动签到_手机京东签到在哪里

    github 京东自动签到_手机京东签到在哪里京东自动签到(利用github实现)+Cooki失效解决办法京东自动签到https://ruicky.me/2020/06/05/jd-sign/参考上面这篇文章,就不转载过来了,原文已经写的很详细了。但自己实践时Sevrer酱提示Cookie失效,同时也看到此文下面有很多跟我一样情况的,所以有提示Cookie失效的请用下面链接的方法获取Cookie,记得复制出来的Cookie值要把所有空格删除。获取京东Cookiehttps://www.plus888.com/21061.html…

  • vue判断map是否为空

    vue判断map是否为空JSON.stringify(data)=='{}’Object.keys(xxx).length==0forin循环判断varobj={};varb=function(){for(varkeyinobj){returnfalse;}returntrue;}alert(b());//true

  • 工程师的基本功是什么?如何练习?—学习心得分享「建议收藏」

    开头聊几句1、周末休息,今天下雨了,气温还行,不冷不热2、刚看完《这!就是街舞》,很燃很炸,一些作品表达的东西也很让人感动3、发现真正热爱的事情,并为之付出所有的能量,很让人羡慕开头周四上线到比较晚,好在中间有空,去公司楼下湖边散了散步,上线回到家,已经是凌晨了。周五中午在去公司的路上看到了美团技术团队的一篇文章,觉得很不错,值得学习,也分享到朋友圈了,希望保留下方便自己查阅,也分享给更多的技术伙伴,一起看好的文章。在技术之路上,不断的持续学习,持续进步,一起精进。那天朋友圈分享美团的这

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号