关于hbuilderx初次编译uniapp项目的微信小程序所遇到的问题

最新推荐文章于 2024-06-14 09:10:35 发布
原创 最新推荐文章于 2024-06-14 09:10:35 发布
· 4.5k 阅读 · 1 ·
版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

相关插件的安装

预编译器错误：代码使用了less语言，但未安装相应的编译器插件，请前往插件市场安装该插件: 11:37:08.670
https://ext.dcloud.net.cn/plugin?name=compile-less at
wxcomponents\components\gaoyia-parse\parse.vue:1

进入插件市场，导入插件到hbuilderx
在这里插入图片描述
点击确定进行安装
在这里插入图片描述
再跑一次微信小程序项目
在这里插入图片描述
显示端口关闭：
在这里插入图片描述
进入微信开发者工具进行设置；开启服务端口
在这里插入图片描述
再次编译一次：成功
在这里插入图片描述

使用 HBuilder X 进行 uniapp 小程序开发遇到的问题合集
shenjing_Shining的博客
07-03 1174
HBuilder X 版本：HBuilderX.4.15.2024050802微信开发者工具版本：wechat_devtools_1.06.2405020_win32_x64。
用uniapp开发微信小程序
wdx0211的博客
06-20 1573
一、为什么使用uni-app？1.微信定义的这套语法，wxml、wxs，以及wx:if等语法，私有化太强。2.uni-app支持跨端多平台编译，多端开发成本低。3.基于通用的前端技术栈，采用vue语法+微信小程序api，没有额外的学习成本。二、uni-app项目起步uni-app官方推荐的开发工具为HBuilderX，不过由于本人习惯使用vscode，因此介绍如何在vscode中使用uni-app。1.CLI工程全局安装 vue-cli 3.x（如已安装请跳过此步骤）
HBuilderX 编译 Uniapp 微信小程序失败
u011929670的博客
07-07 4439
failed to load config from vite.config.ts HBuilderX 编译 Uniapp 微信小程序失败
HBuilderX uni-app发行到微信小程序时报错（已解决）
木啊马
12-17 8918
作为新手第一次使用HBuilderX uniapp 发行到微信小程序时 , 很大程度会出现以下的错报错提醒发行。
首次配置uniapp和微信小程序，报错
Wolves_howl的博客
06-01 929
首次配置uniapp和微信小程序，报错如下： 需要配置三个地方 1）在IDEA中运行=>运行到小程序模拟器=>运行配置，选择安装好的微信开发者工具位置 2）微信开发工具设置=>安全设置=>安全，打开服务端口 3）将uni-app生成小程序工程的路径拷贝到微信开发者工具创建小程序目录里面，并新建项目： ...
【bug】HbuilderX运行到微信小程序 报错
ys_healone的博客
12-03 4291
uni-app代码本身在HbuilderX里运行H5是没问题的,然后运行到微信小程序编译后生成的vender.js,runtime.js报错
HBuilderX uniapp项目运行到小程序一直正在编译的问题
weixin_54215247的博客
03-07 1648
搜了好多，都是说 条件编译，代码位置的问题，但是我的配置文件里没有 if endif。hbuilder用的好好的，启动新项目，一直在编译中...奇怪的是，启动上一个项目没有问题的啊......然后看了下日志，发现问题了，node访问不到。更新node路径后，就编译成功了。
如何用uniapp开发微信小程序
2203_76123090的博客
06-14 1594
在 pages.json 中提供 tabBar 配置，不仅仅是为了方便快速开发导航，更重要的是在App和小程序端提升性能。在这两个平台，底层原生引擎在启动时无需等待js引擎初始化，即可直接读取 pages.json 中配置的 tabBar 信息，渲染原生tab。在小程序启动时，默认会下载主包并启动主包内页面，当用户进入分包内某个页面时，会把对应分包自动下载下来，下载完成后再进行展示。因小程序有体积和资源加载限制，小程序平台提供了分包方式，优化小程序的下载和启动速度。则需要在 pages.json 中填写。
微信小程序使用uni-app开发小程序及部分功能实现详解心得
Fang2001131919的博客
06-19 4790
uni-app 是一个使用 Vue.js (opens new window) 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等多个平台；到此这篇关于微信小程序使用uni-app开发小程序及部分功能实现的文章就介绍到这了,更多相关微信小程序用uni-app开发小程序内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
uni-app的初次开启微信小程序调试
weixin_45519244的博客
01-28 5141
uni-app初次使用微信小程序调试 在开发uni-app项目过程中，如何开始微信小程序进行实时编译调试。首先根据官网做如下配置： 注册微信小程序地址：https://mp.weixin.qq.com/ 微信开发者文档地址：https://developers.weixin.qq.com/miniprogram/dev/framework/quickstart/ uni-app官网地址：https://uniapp.dcloud.io/ 注册之后登陆 **1-打开HBuilder
HBuilderX初次开发uni-app各种配置
graphyer的博客
03-28 3623
你需要下载HBuilder和微信开发者工具需要申请微信小程序appid当然后面的开发还有很多事情要做，慢慢去学吧，比如下载uni-ui插件使用等。
hbuilder X发布微信小程序失败的解决方法
南北极之间
03-10 5990
如果是包太大，就先分包；（分包后，主包仍然很大，而且也无法继续拆分的话，就试试在【发行】里面点【发布】！而不是在【运行】里面上传代码！但是主包里还有很多uniui的组件，占了2m多，之前一直是点击运行，然后再上传代码。提示的超过2m无法上传。uniapp 超过2m无法上传代码！uni-module太大了，小程序无法上传怎么办？还有要先关闭运行中的小程序项目。然后再点【发布】，让hbuilder X软件自动去启动微信开发者工具，有时候要点击很多次。有时候，会因为网络不良或者管理员权限问题导致发布失败。
微信小程序编译bug---Hbuilderx编译时一直卡在编译界面
lesnsnsn的博客
02-10 7030
微信小程序项目前端开发遇到问题，编译一直卡住
使用hbuilderx开发小程序项目遇到的问题
Debug的博客
05-10 1077
在hbuilderx运行项目时候使用vue语法，当运行起来之后切回hbuilderx将语法改为微信小程序语法即可，不影响小程序编译，但是hbuilderx终端会有报错信息。因为在hbuilderx中开发使用的是vue语法，绑定元素是v-if=”元素“，但是运行到微信开发者工具上则会直接将这个属性以值的形式展示到页面。配置全局就比较方便了，找到pages.json文件与tabar及pages对象同级直接声明添加即可，例如下图plugins。或者用一个最笨的方法。
【HbuilderX+微信小程序开发者工具解决报错问题】
fangcaojushi的博客
03-02 4620
[ app.json 文件内容错误] app.json: 在项目根目录未找到 app.json (env: Windows,mp,1.06.2301160;导入微信开发者工具后project.config.json文件被微信开发者工具修改，缺少代码：“miniprogramRoot”在project.config.json文件中，添加app.json的路径，代码如下。安装路径等，还包括小程序的appid,并且要和申请的帐号匹配的登录才能正常的运行。win7的系统，安装的微信小程序开发者工具的版本是。
HBuilderX uni-app 打包发行微信小程序
热门推荐
lhz_333的博客
12-06 1万+
本文主要记录下HBuilderX uni-app 打包微信小程序的配置及发行步骤。
HBuilderX发布小程序打不开微信小程序开发工具
小猿同学628的博客
01-05 3210
uniapp混合开发小程序 通过HBuildX 打不开微信开发者工具
Hbulider 运行微信开发者工具报错
qq_46373192的博客
07-20 6017
Hbulider 运行微信开发者工具报错，打开服务端口也不好使
uni-app开发环境配置的过程
m0_53690581的博客
03-07 1419
1，安装HbuildX - 官网下载：https://www.dcloud.io/hbuilderx.html 选择APP开发版 - 解压后使用并安装插件 - 安装插件：工具=>插件安装（uni-app(vue2)编译、uni-app(vue3)编译、scss/sass编译） 2，创建第一个uni-app - 启动HbuildX，文件=>新建=>项目=>选择uni-app=>填写项目名，项目路径=>选择项目模板：uni-ui项目=>点击创建..
uniapp开发微信小程序vue前后端
最新发布
12-28
### 使用 UniApp 开发微信小程序的 Vue 前后端分离教程 #### 项目初始化与环境搭建 为了启动一个新的基于 Vue 的 UniApp 项目，开发者需安装 HBuilderX 或者通过命令行工具 `vue-cli` 创建新项目。对于已有开发经验的人来说，推荐使用后者来快速创建模板。 ```bash npm install -g @vue/cli vue create my-uniproject cd my-uniproject vue add uni-app ``` 上述命令将设置好基础框架并集成必要的插件[^3]。 #### 后端服务构建 (Spring Boot) 选用 Spring Boot 构建 RESTful API 接口作为服务器端逻辑处理单元。此部分负责数据存储、业务流程控制等功能模块的设计实现。确保API接口的安全性和高效性至关重要，在此基础上可进一步考虑加入认证授权机制以保护敏感操作。 定义实体类映射数据库表结构；编写 Repository 层完成增删改查基本功能；Service层封装具体业务方法；Controller暴露HTTP请求入口给前端调用[^4]。 #### 数据交互与页面展示 在客户端即UniApp侧，则主要关注于视图渲染及事件响应等方面的工作： - **网络请求**：利用内置 axios 库发起 HTTP 请求获取远程资源； - **状态管理**：借助 Vuex 实现全局共享的状态管理模式； - **路由导航**：依靠 vue-router 控制不同页面间的跳转关系； - **组件化编程**：按照功能划分多个独立的小部件组合成完整的界面布局。 例如，要显示用户的订单列表，可以在相应的页面组件内执行如下代码片段: ```javascript export default { data(){ return{ orders:[] } }, onLoad:function(option){ this.loadOrders(); }, methods:{ loadOrders:async function(){ let res=await uni.request({ url:'https://example.com/api/orders', method:"GET" }); if(res.statusCode===200)this.orders=res.data; } } } ``` 这段脚本实现了当页面加载时自动拉取后台提供的订单信息，并将其赋值给本地变量用于后续呈现。 #### 性能优化建议 考虑到用户体验的重要性，针对大型应用还应采取措施降低初次加载时间以及提高运行效率。比如合理运用懒加载技术减少不必要的资源消耗；采用按需编译的方式避免一次性打包过多无用代码进入主文件中[^2]。
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值