NativeScript Vue Snippets for Visual Studio Code

vscode extension with useful snippets for developing NativeScript-Vue mobile applications.

Based on the NativeScript XML Snippets extension, but adapted to the Vue binding and added other snippets not related to the XML templating system.

All snippets are prefixed with ns. Attributes do not have a prefix.

Code Snippets

• Create a Vue instance - nsvue
• HTTP Fetch example - nsfetch
• isIOS import sentence - nsisios
• isAndroid import sentence - nsisandroid
• NS app import sentence - nsapp
• NS launchEvent block code - nslaunchevent
• NS-vue $navigateTo(Component) sentence - nsnavigate

UI Components

Layouts

• Absolute Layout - nsabsolute
• Dock Layout - nsdock
• Grid Layout - nsgrid
• Stack Layout - nsstack
• Wrap Layout - nswrap

Widgets

• Page - nspage
• Action Bar - nsactionbar
• Label - nslabel
• Text Field - nstextfield
• Secure Text Field (for passwords) - nspassword
• Text View - nstextview
• Image - nsimg
• Border - nsborder
• Button - nsbtn
• Search Bar - nssearchbar
• Switch - nsswitch
• Slider - nsslider
• Progress - nsprogress
• Activity Indicator - nsloading
• Date Picker - nsdate
• Time Picker - nstime
• List Picker - nslistpicker
• Segmented Bar - nssegmentedbar
• Tab View - nstabview
• List View - nslistview
• Web View - nswebview

Attributes

• icon - icon
• textWrap - wrap
• horizontalAlignment - halign
• verticalAlignment - valign
• visibility - visibility
• stretch - stretch
• keyboardType - kbtype

How to use?

1. Inside Visual Studio Code press

CTRL + P

2. Type the following in the console window

ext install nativescript-vue-snippets

3. Hit enter.