学会用命令行创建uni-app项目并用vscode开放项目

这篇具有很好参考价值的文章主要介绍了学会用命令行创建uni-app项目并用vscode开放项目。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

(创作不易,感谢有你,你的支持,就是我前行的最大动力,如果看完对你有帮助,请留下您的足迹)

学会用命令行创建uni-app项目并用vscode开放项目,# uni-app入门,vue.js,前端,javascript,vscode

目录

创建 uni-app 项目

命令行创建 uni-app 项目

编译和运行 uni-app 项目:

用 VS Code 开发 uni-app 项目


创建 uni-app 项目

命令行创建 uni-app 项目

(不必依赖 HBuilderX)
vue3+ts版: npx degit dcloudio/uni-preset-vue#vite-ts 项目名称
学会用命令行创建uni-app项目并用vscode开放项目,# uni-app入门,vue.js,前端,javascript,vscode
学会用命令行创建uni-app项目并用vscode开放项目,# uni-app入门,vue.js,前端,javascript,vscode
官网链接: https://uniapp.dcloud.net.cn/quickstart-cli.html#创建uni-app

编译和运行 uni-app 项目:

学会用命令行创建uni-app项目并用vscode开放项目,# uni-app入门,vue.js,前端,javascript,vscode

学会用命令行创建uni-app项目并用vscode开放项目,# uni-app入门,vue.js,前端,javascript,vscode

学会用命令行创建uni-app项目并用vscode开放项目,# uni-app入门,vue.js,前端,javascript,vscode

学会用命令行创建uni-app项目并用vscode开放项目,# uni-app入门,vue.js,前端,javascript,vscode

学会用命令行创建uni-app项目并用vscode开放项目,# uni-app入门,vue.js,前端,javascript,vscode

最后将文件导入微信开发者工具即可

学会用命令行创建uni-app项目并用vscode开放项目,# uni-app入门,vue.js,前端,javascript,vscode

在终端下载过程中可能遇到的问题:

无法将“pnpm”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。请检查名称的拼写,如果包括路径,请确保路径正确,然后再试一次。

学会用命令行创建uni-app项目并用vscode开放项目,# uni-app入门,vue.js,前端,javascript,vscode

解决方法:

npm i-g pnpm

学会用命令行创建uni-app项目并用vscode开放项目,# uni-app入门,vue.js,前端,javascript,vscode

用 VS Code 开发 uni-app 项目

为什么选择 VS Code ?
HbuilderX 对 TS 类型支持暂不完善
VS Code 对 TS 类型支持友好,熟悉的编辑器

学会用命令行创建uni-app项目并用vscode开放项目,# uni-app入门,vue.js,前端,javascript,vscode学会用命令行创建uni-app项目并用vscode开放项目,# uni-app入门,vue.js,前端,javascript,vscode

pnpm i -D @types/wechat-miniprogram @uni-helper/uni-app-types
    "types": [
      "@dcloudio/types",
      "@types/wechat-miniprogram",
      "@uni-helper/uni-app-types"
    ]
  },
  "vueCompilerOptions": {
    "nativeTags": ["block", "component", "template", "slot"]
  },

 

学会用命令行创建uni-app项目并用vscode开放项目,# uni-app入门,vue.js,前端,javascript,vscode文章来源地址https://www.toymoban.com/news/detail-702896.html

到了这里,关于学会用命令行创建uni-app项目并用vscode开放项目的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 如何使用Vscode开发Uni-app项目以及注意事项详解

    哟,大牛来了!!! 前言 :想必大家敲代码用的编辑器大多数都是Vscode吧,随着技术的更新,uni-app成为了前端不可或缺的一项技术,但是呢,官方推荐使用的HBuilderX编辑器让习惯了使用Vscode的我们不太习惯,虽然HBuilderX编辑器对uni-app极度的友好,但还是让在座的各位大牛以及

    2024年02月05日
    浏览(67)
  • uni-app教程一(项目创建、tabbar配置、运行

    导入静态资源包(图片) 页面tabbar配置 { “pages”: [ //pages数组中第一项表示应用启动页,参考:https://uniapp.dcloud.io/collocation/pages { “path”: “pages/index/index”, “style”: { “navigationBarTitleText”: “首页” } }, { “path”: “pages/news/news”, “style”: { “navigationBarTitleText”: “动态

    2024年04月23日
    浏览(53)
  • Uni-app + Vue3 + TS +Vite 创建项目

    npm 都很熟,可是与 npm 如此相似的 npx 是干嘛的呢?我们为甚要介绍 npx ? 由于 uni-app 官方提供创建命令使用的是 npx,所以我们先来了解下 npx 是干什么的?它与 npm 的区别。 npx 是 npm 的高级版本,它从 npm v5.2 版本开始引入的,与 npm 绑定在一起,无需额外安装,具有更大的功

    2023年04月15日
    浏览(80)
  • uni-app 可视化创建的项目 移动端安装调试插件vconsole

     可视化创建的项目,在插件市场找不到vconsole插件了。 又不好npm install vconsole 换个思路,先创建一个cli脚手架脚手架的uni-app项目,然后再此项目上安装vconsole cli脚手架创建uni-app项目 安装插件 项目Terminal运行命令:npm install vconsole   安装完成之后,插件在node_modules/vconsol

    2024年02月10日
    浏览(45)
  • 创建一个uni-app项目并运行再浏览器及微信小程序

    第一步: 打开HBuilder X 点击文件列表 新建 项目 第二步: 如图所示(根据项目所需要的进行选择) 第三步: 创建完成之后项目文件的(介绍以及作用) 第四步: 如何将uni-app项目运行到不同的浏览器,我在这里运行的是微信小程序 (1) 点击运行可以查看到项目的多种运行方式 (2

    2024年02月12日
    浏览(74)
  • 前端-vscode中开发uni-app

    node -v npm install @vue/ cli@4.5.15 -g 指定版本号:4.5.15 在自己电脑目录下创建项目: demo02是自己项目名字 在D/AllCode/vs_vue2_uniapp目录下执行一下命令: vue create -p dcloudio/uni-preset-vue demo02 要想在vscode执行npm命令 我们打开pages.json和manifest.json,发现会报红,这是因为在json中是不能写注

    2024年01月18日
    浏览(68)
  • 使用vscode开发配置uni-app(小程序)

    这个文件是用 VsCode 写 uniapp 小程序的步骤笔记 安装Vue脚手架(vue-cli) 通过脚手架创建 uni-app 项目 我们是初学者就直接选择默认模板 创建好后用vscode打开项目 安装vue语法提示插件 vetur 和 vue-helper 安装组件语法提示 初始化npm 从git下载代码块放到项目目录下的 .vscode (没有文件夹

    2024年02月08日
    浏览(83)
  • 【uni-app】—3.新建一个uni-app项目

    这里需要登录,自行用邮箱注册登录,再下载安装插件,安装完成如下 api 用来封装数据接口 common 用来存放js、css等 components 用来存放公共可复用的vue组件 config 用来存放数据配置文件 mock 用来 存放模拟数据 pages 用来存放页面 static 存放静态资源文件 APP.vue 项目主应用文件

    2024年02月09日
    浏览(66)
  • 【第三趴】uni-app页面搭建与路由配置(了解工程目录结构、学会搭建页面、配置路由并成功运行)

    聚沙成塔——每天进步一点点,大家好我是几何心凉,不难发现越来越多的前端招聘JD中都加入了uni-app 这一项,它也已经成为前端开发者不可或缺的一项技能了,所以凉哥为大家推出 聚沙成塔【45天玩转uni-app】 专栏,帮助大家对 uni-app 进行学习和理解,uni-app可以通过一套代

    2024年02月02日
    浏览(44)
  • 这可能是最好、最详细的VSCode开发uni-app教程吧

    我们将使用VSCode写 uni-app ,不同于 Hbuilder X ,用VSCode是通过脚手架来创建项目,为什么我要用VSCode写呢?可能还是不太习惯 Hbuilder X 等等原因,还有就是不想换开发工具,觉得开发前端一个VSCode就够了,也不用去比较两者谁好谁坏,自己喜欢哪个用哪个,这里就不过多赘述了

    2024年02月02日
    浏览(112)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包