VSCode 配置uni-app的方法


Posted in Javascript onJuly 11, 2020

CLI工程全局安装vue-cli

npm install -g @vue/cli

通过cli创建uni-app项目

 vue create -p dcloudio/uni-preset-vue uni-app

选择项目模板,可自由选择如下图:?

VSCode 配置uni-app的方法

VSCode 配置uni-app的方法

使用vscode打开创建的项目

VSCode 配置uni-app的方法

安装vue语法提示插件?

VSCode 配置uni-app的方法

cli工程自带uni-app&5+app语法提示

安装组件语法提示

npm i @dcloudio/uni-helper-json

从 git 下载 uni-app 代码块,放到项目目录下的 .vscode 目录即可拥有和 HBuilderX 一样的代码块。

VSCode 配置uni-app的方法

VSCode 配置uni-app的方法

使用scss样式

#先安装node-sass
 npm install node-sass
 #然后安装sass-loader,这里安装7.3.1版本,版本可选择性更新,因为高版本可能会报错
#使用 cnpm 会快一些
 cnpm install sass-loader@7.3.1

运行项目

npm run dev:%PLATFORM%

发布项目

npm run build:%PLATFORM%

%PLATFORM% 可选值参见package.json中的scripts

VSCode 配置uni-app的方法

HBuilderX 工程

  • HBuilderX 创建的工程默认不带 types 语法提示,在 vscode 中编辑的时候,可以自行安装
  • 初始化npm

npm i @types/uni-app @types/html5plus -D

安装uni-app语法提示

npm i @types/uni-app @types/html5plus -D

uni-app项目中manifest.json、pages.json 等文件可以包含注释。vscode 里需要改用 jsonc 编辑器打开

VSCode 配置uni-app的方法

总结

到此这篇关于VSCode 配 uni-app的文章就介绍到这了,更多相关VSCode 配 uni-app内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
xml分页+ajax请求数据源+dom取结果实例代码
Oct 31 Javascript
document.getElementById为空或不是对象的解决方法
Jan 24 Javascript
AngularJS HTML编译器介绍
Dec 06 Javascript
使用EVAL处理jqchart jquery 折线图返回数据无效的解决办法
Nov 26 Javascript
基于JavaScript实现一定时间后去执行一个函数
Dec 14 Javascript
使用CSS+JavaScript或纯js实现半透明遮罩效果的实例分享
May 09 Javascript
JS获取随机数和时间转换的简单实例
Jul 10 Javascript
jQuery中的on与bind绑定事件区别实例详解
Feb 28 Javascript
ReactNative中使用Redux架构总结
Dec 15 Javascript
node中的session的具体使用
Sep 14 Javascript
解决betterScroll在vue中存在图片时,出现拉不动的问题
Sep 27 Javascript
从0到1构建vueSSR项目之node以及vue-cli3的配置
Mar 07 Javascript
深入解析微信小程序开发中遇到的几个小问题
Jul 11 #Javascript
微信小程序上传帖子的实例代码(含有文字图片的微信验证)
Jul 11 #Javascript
详解JavaScript匿名函数和闭包
Jul 10 #Javascript
Vue watch响应数据实现方法解析
Jul 10 #Javascript
详解Vue之事件处理
Jul 10 #Javascript
jQuery开发仿QQ版音乐播放器
Jul 10 #jQuery
Element图表初始大小及窗口自适应实现
Jul 10 #Javascript
You might like
类的另类用法--数据的封装
2006/10/09 PHP
php防注
2007/01/15 PHP
PHP间隔一段时间执行代码的方法
2014/12/02 PHP
Laravel5.5新特性之友好报错以及展示详解
2017/08/13 PHP
PHP空值检测函数与方法汇总
2017/11/19 PHP
JS函数验证总结(方便js客户端输入验证)
2010/10/29 Javascript
JS 表单验证大全
2011/11/23 Javascript
js中escape对应的C#解码函数 UrlDecode
2012/12/16 Javascript
js控制分页打印、打印分页示例
2014/02/08 Javascript
javascript中的previousSibling和nextSibling的正确用法
2015/09/16 Javascript
JavaScript生成二维码图片小结
2015/12/27 Javascript
通过正则表达式获取url中参数的简单实现
2016/06/07 Javascript
easyUI实现类似搜索框关键词自动提示功能示例代码
2016/12/27 Javascript
Vue单页面应用保证F5强刷不清空数据的解决方案
2018/01/31 Javascript
详解Vue打包优化之code spliting
2018/04/09 Javascript
浅谈在不使用ssr的情况下解决Vue单页面SEO问题(2)
2018/11/08 Javascript
解决echarts数据二次渲染不成功的问题
2020/07/20 Javascript
[03:03]2014DOTA2国际邀请赛 EG战队专访
2014/07/12 DOTA
Python 返回汉字的汉语拼音
2009/02/27 Python
举例讲解Python中的算数运算符的用法
2015/05/13 Python
详解Appium+Python之生成html测试报告
2019/01/04 Python
对python中不同模块(函数、类、变量)的调用详解
2019/07/16 Python
Python Sympy计算梯度、散度和旋度的实例
2019/12/06 Python
python实现从尾到头打印单链表操作示例
2020/02/22 Python
Pytorch中的自动求梯度机制和Variable类实例
2020/02/29 Python
html5文字阴影效果text-shadow使用示例
2013/07/25 HTML / CSS
英国网上花店:Bunches
2016/11/29 全球购物
Sandro Paris美国官网:典雅别致的法国时尚服饰品牌
2017/12/26 全球购物
大学生自我鉴定
2013/12/16 职场文书
会计专业自我鉴定范文
2013/12/29 职场文书
《凡卡》教学反思
2014/04/09 职场文书
庆祝国庆节标语
2014/10/09 职场文书
2015年置业顾问工作总结
2015/04/07 职场文书
年终奖金发放管理制度,中小企业适用,拿去救急吧!
2019/07/12 职场文书
Python爬虫基础讲解之请求
2021/05/13 Python
python的列表生成式,生成器和generator对象你了解吗
2022/03/16 Python