浅谈VUE uni-app 开发环境

目录
  • 1.通过 HBuilderX 可视化界面
  • 2.通过 vue-cli 命令执行
  • 总结

1.通过 HBuilderX 可视化界面

a. 创建uni-app；

b. 运行uni-app;

c. 发布uni-app

2.通过 vue-cli 命令执行

a. 安装node.js，下载地址：https://nodejs.org/en/download/

##检查node.js 版本
node -v
v14.18.1
npm -v

b. 全局安装 vue-cli

npm install -g @vue/cli

c. 创建uni-app

cd my-project
npm run serve
npm run build:%PLATFORM%

d. 运行、发布uni-app

总结

本篇文章就到这里了，希望能够给你带来帮助，也希望您能够多多关注我们的更多内容！

赞 (0)

相关推荐

  • 浅谈VUE uni-app 核心知识

    目录 规范 a. 页面文件遵循vue单文件组件规范 b. 组件标签靠近小程序规范 c. 接口能力(JS API)靠近微信小程序规范 e. 数据绑定及事件处理使用Vue.js 规范 特色 a. 条件编译 b. App端的Nvue开发 c. HTML5+ 总结 规范 a. 页面文件遵循vue单文件组件规范 <!-- 模板块 --> <template> <view class="main"> {{msg}} </view> </temp

  • 浅谈VUE uni-app 模板语法

    1.v-bind(简写 :) 组件属性中要使用data中定义的数据变量,或组件属性要使用表达式,需用v-bind指定 简写 : 2.v-on(简写@) 监听DOM事件 click.stop 可以阻止事件穿透 3.v-model 数据双向绑定 4.v-if,v-else-if,v-else 条件判断,决定某个内容是否挂载 5.v-show 条件判断,决定某个内容是否显示 6.三元运算符 7.空标签 block 8.v-for:列表渲染 <template> <view v-bind:cla

  • 浅谈VUE uni-app 基础组件

    1 .scroll-view 使用竖向滚动时,需要给 一个固定高度,通过 css 设置 height:使用横向滚动时,需要给添加white-space: nowrap;样式. scroll-y:允许纵向滚动,scroll-x:允许横向滚动 @scroll: 滚动时触发,event.detail = {scrollLeft, scrollTop, scrollHeight, scrollWidth, deltaX, deltaY} 数据双向绑定 <template> <view> &

  • 浅谈VUE uni-app 自定义组件

    1.父组件向子组件传递数据可以通过 props 2.子组件向父组件传递数据可以通过自定义事件,父组件自定义事件,子组件触发父组件的事件,并传传递数据 3.子组件可以定义插槽slot,让父组件自定义要显示的内容 4.使用easycom规范,可以真接使用组件 page/news/news.vue <template> <view> <veiw>自定义组件使用规范</veiw> <card color="red" @fclick=&quo

  • 浅谈SpringMVC+Spring3+Hibernate4开发环境搭建

    浅谈SpringMVC+Spring3+Hibernate4开发环境搭建

    早期的项目比较简单,多是用JSP .Servlet + JDBC 直接搞定,后来使用 Struts1(Struts2)+Spring+Hibernate, 严格按照分层概念驱动项目开发,这次又使用 Spring MVC取代Struts来进行开发. MVC已经是现代Web开发中的一个很重要的部分,下面介绍一下SpringMVC+Spring3+Hibernate4的开发环境搭建 先大致看一下项目结构: 具体的代码不再演示,主要是走了一个很平常的路线,mvc-servcie-dao-hibernat

  • 浅谈vue项目利用Hbuilder打包成APP流程,以及遇到的坑

    1.打包项目 期间遇到的坑,提前说下,避免重复工作. 1.1打包的app出现白屏. 出现原因:路径不对,需要改config\index.js 解决办法:修改打包的路径. 1.2点击页面跳转不了,报 Loading chunk 2 failed. 等错误. 出现原因:不能用history配置路由,要用hash 解决办法:修改路由mode属性为hash. 1.3.点手机物理按钮,直接退出程序. 出现原因:无理返回键直接用监听不到路由,会直接退出程序. 解决办法:可以引入mui,就能正常使用了. 1.

  • 浅谈Vue开发人员的7个最好的VSCode扩展

    在Visual Studio中添加正确的VS Code扩展可以让你作为开发者的生活变得更加轻松. 它们可以帮助格式化.可伸缩性.强制执行最佳实践,从而自动化开发过程中许多容易忘记的任务.它们也可以只是有趣的扩展,使我们的代码看起来更漂亮/更容易编写. 作为一个Vue爱好者,我花了很多时间为Vue开发人员寻找最好的VS Code扩展.这里有一些让我的生活变得如此简单的方法. 准备好了吗? 让我们直接切入正题. Vetur 如果你从这篇文章中下载了一个VS Code扩展,它一定是Vetur. 一个针

  • 浅谈Vue单页面做SEO的四种方案

    目录 1.Nuxt 服务端渲染应用部署 (SSR服务器渲染) 优势: 不足:(开发中遇到的坑) 2.Nuxt 静态应用部署 优势: 不足: 3.预渲染prerender-spa-plugin 优势: 不足: 4.Phantomjs 针对爬虫做处理 优势: 不足: 总结 众所周知,Vue SPA单页面应用对SEO不友好,当然也有相应的解决方案,通过查找资料,大概有以下4种方法.(本人只用过第一,第三种方案) 1.Nuxt 服务端渲染应用部署 (SSR服务器渲染) 关于服务器渲染:Vue官网介绍 ,

  • 浅谈vue项目4rs vue-router上线后history模式遇到的坑

    此次项目开发完后准备打包,因为hash模式的路径带#看着实在是有点丑,所以采用history模式.因为本次项目属于以前网站重构,但是seo问题,所以需要以前的一些地址路径写,所以vue-router的路径全部重改了.打包后查了网上一大堆,都说要把config里的index.js 里的build里的 assetsPublicPath: '/'改成'./',打包上线发现在hash模式下是没问题的, 但一旦改成history模式,有些动态js文件的路径都是错的.无奈之下死马当活马医,把'./'改回了'

  • 浅谈vue引入css,less遇到的坑和解决方法

    在使用vux开发手机页面时,引入vux的公共样式less一直报错,通过各种百度,Google都没有解决,走了很多弯路.最后才发现钻牛角尖了,可以换一种方法引入. 1.报错的使用:在App中 @ ./~/css-loader?{"minimize":false,"sourceMap":false}!./~/vux/src/styles/reset. less 3:10-115 @ ./~/css-loader?{"minimize":false,&

  • 浅谈vue websocket nodeJS 进行实时通信踩到的坑

    先说明,我并不知道出现坑的原因是什么.我只是按照别人的写法就连上了. 我的处境是这样的 我的前台是用了 vue 全家桶,启动了一个 9527 端口. 而我的后台是用 nodeJS,启动了 8081 端口. 很明显,这种情况就出现了头疼的跨域. 贴出我的代码,如下 server.js(后台) var app = express(); var server = require('http').createServer(app); var io = require('socket.io')(serve

  • 浅谈Vue入门需掌握的知识

    浅谈Vue入门需掌握的知识

    Vue作为一款目前最流行的前端框架之一,是许多前端开发工程师的不二选择.最近我在前端岗位上也运用Vue实现了几款产品,那么今天来分享一下Vue是什么,以及我对Vue的见解. 一.定义 Vue是一套用于构建用户界面的渐进式JavaScript框架 与传统JS和JQuery框架不同,Vue的渐进式框架表示开发者可以由简单组件写起,渐渐搭建出一个复杂的前端平台. 形成Vue渐进式框架的核心概念为:组件化,MVVM,响应式,和生命周期,下面会一个个详细介绍. 二.为什么要用Vue? 1. 组件化 Vue

  • 浅谈VUE项目打包后运行页面一片白问题

    目录 1.说明 2.问题说明 3.解决 3.1.index.js 3.2.utils.js 3.3.webpack.prod.conf.js 4.总结 1.说明 我们用VUE搭建一个脚手架后,在IDEA等工具中开发时,启动都没有什么问题,但是项目开发完成之后,可能需要部署上线,所以需要进行打包操作了,一般都是用下面命令进行打包: npm run build 打包过程一般没有什么问题,然后就会在工程目录下生成一个[dist]文件夹,里面就是我们打包好的文件,把这些文件部署到Nginx中或者Tomc

  • 浅谈Vue父子组件和非父子组件传值问题

    本文介绍了浅谈Vue父子组件和非父子组件传值问题,分享给大家,具体如下: 1.如何创建组件 1.新建一个组件,如:在goods文件夹下新建goodsList.vue <template> <div class='tmpl'> goodsList组件 </div> </template> <style> </style> <script> export default { data() { return{} }, creat

随机推荐