Cordova in VisualStudio Code
编者语:这几年都在跨平台移动开发中努力,Xamarin/Cordova/RemObject都是业界比较通用的方案。而开发工具有Visual Studio /Xamarin/ Fire等。就在昨天微软发布并开源了Visual Studio Code 的Cordova开发工具,今天就和大家谈谈。
Visual Studio Code 快发布差不多一年了,在Connect 2015中已经开始支持各类型的插件。而新的一年,将会是Visual Studio Code 很重要的一年。新年开了个不错的头,就是Cordova的开发工具。这个工具支持Cordova的开发,调试,和相关插件的智能提示。我们就来看看几个功能。
1. 安装,在Mac上打开Visual Studio Code 按cmd+shift+p 使用ext install 进行安装
2. 编码,其实这个你就等于是有智能提示地写一些Cordova的支持。例如你添加一些插件,如相机等。
3. 你可以通过Visual Studio Code 快速编译你的Cordova项目 cmd+B
4. 可以方便在Debug中根据不同需要调用不同的运行环境
以上四点,你可以在Visual Studio Market 中找到 (https://marketplace.visualstudio.com/items?itemName=vsmobile.cordova-tools)
5. 代码调试,这个也得感谢微软Cordova的团队,他们帮我解决了在VS Code 上Ionic 2调试的问题。下面我分享给大家。
首先你必须对现在Ionic 2的webpack.config.js进行调整
a) 由于VS Code 的Cordova 插件是通过绑定source-map进行调试的 所以先安装
npm install source-map-loader strip-sourcemap-loader
b) 在webpack.config.js 中添加 devtool:'source-map' ,去生成app.bundle.js.map
c) 指定在调试期间,所对应的位置,在output添加devtoolModuleFilenameTemplate: 'file:///[absolute-resource-path]'
d) 在loaders最后设置一个,这个是告诉编译器都需要把所有js加载到sourcemap当中
- {
- test: /\.js$/,
- loader: 'strip-sourcemap'
- }
e) 切记这里不要用Cordova Build, 要用ionic build所以这里比较麻烦地需要在命令行运行,当然你可以通过设置Task去做
但这个我觉得还是命令行方便(我在这里还是花了不少时间,还是自己大意)
f) 在app.bundle.js设置对应的断点即可,我现在还没有办法去调试ts(这个估计是webpack的问题,但是我相信很快会有对应的 解决方案),但是可以直接调试ts生成的js文件,如图我在app.bundle.js设置了断点,当我在运行debug时就可以去到断点位 置了。
Visual Studio Code 随着插件功能的加入,现在已经可以作为生产力工具了。我也已经把它作为生产力工具多时去完成云加端的开发。Cordova插件的推出为跨平台开发带来了不少推动作用,当然接下来我更期待的是ReactNative和Xamarin。
Cordova in VisualStudio Code的更多相关文章
- 使用 visualstudio code 编辑器调试执行在 homestead 环境中的 laravel 程序
由于之前做 .net 开发比较熟悉 visualstudio,所以自 visualstudio code 发布后就一直在不同场合使用 vscode ,比如前端.node等等.最近在做 laravel ...
- ionic3 打包报错[ERROR] An error occurred while running cordova prepare (exit code 1):
解决办法:删除并重新添加平台以使用以下命令解决问题: cordova platform rm ios cordova platform add ios 如果执行 ionic cordova build ...
- 使用VisualStudio或VisualStudio Code作为代码比较工具
最近改了了几个还是用SVN托管的老项目,用的客户端是TortoiseSVN,本身这个工具比较好用,就是那个内置的比较文件差异的Diff工具太简陋了,由于TortoiseSVN支持第三方Diff查看器的 ...
- Docker最全教程之使用 Visual Studio Code玩转Docker(二十)
前言 VS Code是一个年轻的编辑器,但是确实是非常犀利.通过本篇,老司机带你使用VS Code玩转Docker——相信阅读本篇之后,无论是初学者还是老手,都可以非常方便的玩转Docker了!所谓是 ...
- 用 Visual Studio Code 调试运行在 homestead 环境中的 laravel 程序
由于之前做 .net 开发比较熟悉 visualstudio,所以自 visualstudio code 发布后就一直在不同场合使用 vscode ,比如前端.node等等.最近在做 laravel ...
- VS Code(待补充)
使用! 然后Tab 快速生成html文档结构 快速生成一个类 .类名 会有提示 .container.box .col-6*2 VisualStudio Code怎么同时编辑多处?
- Visual Studio Code + Docker
前言 VS Code是一个年轻的编辑器,但是确实是非常犀利.通过本篇,老司机带你使用VS Code玩转Docker——相信阅读本篇之后,无论是初学者还是老手,都可以非常方便的玩转Docker了!所谓是 ...
- 2018 .NET开发者调查报告: .NET Core 是怎么样的状态
4月28日,在公众号里发起<.NET Core 使用调查>,该调查为期一周,有近3300名开发者参与. 已经使用.net core 的人数只有44%,计划使用.net core 比例达到 ...
- 分享一个.NET平台开源免费跨平台的大数据分析框架.NET for Apache Spark
今天早上六点半左右微信群里就看到张队发的关于.NET Spark大数据的链接https://devblogs.microsoft.com/dotnet/introducing-net-for-apac ...
随机推荐
- HDU1078记忆化搜索
FatMouse and Cheese Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Othe ...
- 由一篇博文做出的代码,不用Math.round()如何实现其功能
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- Java中String的hash函数分析
转载自:http://blog.csdn.net/hengyunabc/article/details/7198533 JDK6的源码: [java] view plaincopy /** * Ret ...
- UVA 1393 Highways
https://vjudge.net/problem/UVA-1393 题意: a*b的点阵中能画多少条非水平非竖直的直线 方向‘/’ 和 方向 ‘\’ 对称 枚举直线所在矩形的i*j 直线可能重复的 ...
- Linux 使用代理使网速变快
$ export http_proxy="http://USER:PASSWORD@PROXY_SERVER:PORT" $ export https_proxy="ht ...
- 【Dream Counting, 2006 Dec-数数的梦】数位dp
题意:给定两个数,问区间[A,B]中0~9分别出现了多少次.A,B<=10^18 题解:应该是最裸的数位dp吧..一开始没有记忆化tle了TAT 我们可以求出区间[0,B]的,再减去区间[0,A ...
- Android检测View的可见性
Android中我们经常会用到判断View的可见行,当然有人会说View.VISIBLE就可以了,但是有时候这个真是满足不了,有时候我们为了优化,在View滚到得不可见的时候或者由于滚到只显示了部分内 ...
- lua 闪电特效
闪电特效 根据不同的起点 终点 资源做倾斜 拉伸 ,主要是计算倾斜角度. function ZyLight:show(params) local params = params or {} local ...
- 【洛谷 P4116】 Qtree3 (树链剖分)
题目链接 树剖练手题,想复习下树剖. 第一次提交\(T\)成QQC 看我 ??? 看了数据范围的确挺恶心的,我的复杂度是\(O(Mlog^2N)\)的,数据范围有三段 For 1/3 of the t ...
- HTTPS加密通信原理及数字证书系统
https加密通信原理: 公钥私钥成对,公钥公之于众,私钥只有自己知道. 用公钥加密的信息只能由与之相对应的私钥解密. 甲给乙发送数据时,甲先用乙的公钥加密这段数据,再用自己的私钥对这段数据的特征数据 ...