vscode运行Hbuildx创建的uniapp项目

于 2024-06-17 14:49:28 发布
阅读量433 收藏 1
点赞数 1
文章标签： vscode uni-app ide
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_49455560/article/details/139743849
版权

vscode运行Hbuildx创建的uniapp项目

  1. 下载uniapp片段提示插件
    在这里插入图片描述
  2. 下载基于HBuilderX uniapp cli启动插件
    在这里插入图片描述
    下载之后需要重启vscode
  3. 配置uniapp run插件，在.vscode文件下创建launch.json文件
{
  "configurations": [{ "type": "uniapp-run", "request": "launch", "name": "Uniapp Run", "platform": "h5", "vueVersion": "v3" }]
}
  1. 配置扩展配置
    在这里插入图片描述
    在这里插入图片描述
  2. 运行或构建项目
    在这里插入图片描述
peak_chan
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
VsCode搭建Spring Boot项目并进行创建、运行、调试
08-19
"VsCode搭建Spring Boot项目并进行创建、运行、调试" 本资源主要介绍了如何使用VsCode搭建Spring Boot项目，并进行创建、运行、调试。下面是相关的知识点： 一、VsCode安装扩展 * 安装Java Extension Pack (Java...
vscode创建运行Cpp文件
11-09
标题“vscode创建运行Cpp文件”指的是使用Visual Studio Code（简称VSCode）这一强大的源代码编辑器来创建并运行C++程序。VSCode不仅支持多种编程语言，而且具有丰富的扩展功能，使得它在C++开发领域也非常受欢迎。...
在vscoed 中运行 uniapp 项目
热门推荐
yiyi_11的博客
02-21 1万+
在 vscode 中开发并运行 uniapp，使用 uniapp开发 小程序应用
在vscode中运行Hbuilder创建的项目
小多的博客
07-21 4932
想必习惯使用vscode的人突然使用HBuilder很不习惯吧，但是HBuilder创建的项目本身没有调试功能。
vscode uniapp 开发环境快速配置
最新发布
manixchenyang的博客
05-17 1461
vscode替代hbuider解决微信小程序开发解决卡顿问题和使用体验问题提升开发效率。现代化web开发避免不了H5以及混合应用开发，降本增效的必要， 想必hbuilderx的语法提示以及插件没有webstorm和vscode方便，让开发效率大大折扣，其实用vscode好处就是装多少插件都丝毫不卡顿，下面你也可以按照下面的方法尝试一下，由于最近电脑换了个系统，就重新配置下顺便记录下
VSCode 配置uni-app的方法
11-20
CＬＩ工程全局安装vue-cli npm install -g @vue/cli 通过cli创建uni-app项目  vue create -p dcloudio/uni-preset-vue uni-app 选择项目模板，可自由选择如下图：:backhand_index_pointing_down: 使用vscode打开创建的项目 安装vue语法提示插件:backhand_index_pointing_down: cli工程自带uni-app&5+app语法提示 安装组件语法提示 npm i @dcloudio/uni-helper-json 从 git 下载 uni-app 代码块，放到项目目录下的 .vscode 目录即可拥有和 HBuilderX 一样的代码块。 使用scss
学会用命令行创建uni-app项目并用vscode开放项目
来自计科大一萌新的编程记录本
09-09 2311
学习目标：1.创建uni-app项目 2.用vscode开放uni-app项目
VSCode 使用uni-app的方法
weixin_71879136的博客
03-17 2547
VSCode 使用uni-app的方法
VScode运行uniapp项目
啵啵的女孩
08-13 1万+
一、在VScode中创建项目 vue create -p dcloudio/uni-preset-vue my-project 二、在各种小程序端运行 //启动项目（微信小程序） npm run dev:mp-weixin //启动项目（h5） npm run dev:h5 //启动项目（app平台） npm run build:app-plus （也就是App平台运行调试不支持cli方式，需在HBuilderX中运行调试） //启动项目（支付宝小程序） npm run dev:m
如何在vscode中开发运行uniapp项目
weixin_73320836的博客
02-08 1万+
【直接下载即可用】
在vscode中创建并运行uni-app项目
m0_62023847的博客
06-16 2475
创建uni-app项目 如果您创建过程中出现以下错误： 那么请将克隆到你喜欢的文件夹下 ：uni-preset-vue 将改成你刚才下载的模板的绝对地址进行创建即可； 当您的项目出现上图时，那就已经可以创建了，根据你的条件创建项目即可，我选择的是默认模板； 只用了这几个，如果还有别的好用的话，欢迎推荐该文如果能帮到你，是我的荣幸...
如何使用VSCode 运行调试插件代码
10-15
可以使用`yo code`生成器创建一个新的插件项目，这是一个Yeoman生成器，专门用于创建VSCode扩展。在命令行中输入`yo code`，按照提示选择要创建的插件类型，然后遵循向导完成设置。 2. **配置launch.json**： 在你...
在VScode中创建Java项目.pdf
11-03
适合于开始使用VS Code 编写JAVA的初学者
HbuilderX 现有uniapp项目迁移到vscode中(HbuilderX工程改vuecli工程)
weixin_46333911的博客
02-02 1607
解决uniapp项目迁移到vscode中出现的问题
如何使用 vscode 开发 uniapp
weixin_42178050的博客
12-09 2196
如何使用vscode 开发 uniapp 项目
vscode编辑器如何启动和打包HbuilderX 生成的项目
weixin_46221246的博客
11-30 2374
vscode编辑器如何启动和打包HbuilderX 生成的项目
uniapp项目实践第二章：使用vscode开发uniapp项目
jakelihua
08-16 3174
uniapp项目实践第二章：使用vscode开发uniapp项目
vscode 创建uniapp vue3项目
08-19
要在VSCode中创建一个uni-app Vue3项目，你可以按照以下步骤进行操作： 1. 首先，在终端中使用以下命令创建一个uni-app项目： ``` vue create -p dcloudio/uni-preset-vue@next <项目名称> ``` 这个命令会使用uni-app的官方预设模板来创建一个Vue3的uni-app项目。 2. 接下来，进入你的项目目录： ``` cd <项目名称> ``` 3. 然后，使用以下命令安装项目的依赖： ``` npm install ``` 或者如果你使用的是 yarn，可以使用以下命令： ``` yarn install ``` 4. 等待依赖安装完成后，你可以使用以下命令启动开发服务器： ``` npm run dev:＊＊＊-<平台> ``` 这里的 `<平台>` 可以是小程序平台，如`h5＊＊＊-weixin`、`mp-alipay`等。根据你的需求选择对应的平台。 5. 现在，你可以在VSCode中打开你的项目文件夹。在VSCode中，你可以使用uni-app官方的VSCode插件来提供更好的开发支持。你可以通过在VSCode中搜索 "uni-app" 来安装这个插件。 6. 最后，你可以根据需要，在VSCode中进行uni-app项目的开发工作。不过，由于uni-app项目与其他前端项目的差异较大，我还推荐为uni-app项目单独创建一个VSCode工作区。你可以参考相关文章来了解如何创建VSCode工作区。 希望这些步骤对你有帮助！祝你在VSCode中顺利创建和开发uni-app Vue3项目！<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* *3* [VSCode中如何开发uni-app？](https://blog.csdn.net/weixin_49865737/article/details/126342498)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 100%"] [ .reference_list ]

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值