Skip to content

Commit 51c381a

Browse files
authored
Update 3-installation.md
Found having the Vue CLI instructions on the quick start page very confusing as you cannot start without first going through the installation page instructions so makes sense to move Vue CLI and project instructions to this document AFTER the initial install instructions. Also no need to go through Node and NativeScript install steps as they are included already in the install steps for each of the systems.
1 parent 394b0fe commit 51c381a

File tree

1 file changed

+44
-18
lines changed

1 file changed

+44
-18
lines changed

content/docs/en/getting-started/3-installation.md

Lines changed: 44 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -5,28 +5,12 @@ contributors: [rigor789, TheOriginalJosh, eddyverbruggen, ikoevska]
55

66
To use NativeScript-Vue, you need to set up your system to compile your apps.
77

8-
## Prerequisites
8+
## Choose your System
99

10-
- [Node.js](#nodejs)
11-
- [NativeScript CLI](#nativescript-cli)
1210
- [Windows](#windows) (for developing Android applications on Windows)
1311
- [macOS](#macos) (for developing iOS and Android applications on macOS)
1412
- [Linux](#linux) (for developing Android applications on Linux)
1513

16-
### Node.js
17-
18-
Download and install the latest _LTS_ version of Node.js from [https://nodejs.org/](https://nodejs.org/). Restart your terminal and verify the installation was successful by running `node --version`.
19-
20-
### NativeScript CLI
21-
22-
To install the NativeScript CLI, open your terminal and run:
23-
24-
```shell
25-
$ npm install -g nativescript
26-
```
27-
28-
Verify the installation was successful by running `tns` in your terminal. You should see a list of the available commands.
29-
3014
### Windows
3115

3216
Check the system requirements and follow the setup instructions for the Android SDK on Windows:
@@ -43,4 +27,46 @@ Check the system requirements and follow the setup instructions for Xcode and th
4327

4428
Check the system requirements and follow the setup instructions for the Android SDK on Linux:
4529

46-
[Advanced setup: Linux](https://docs.nativescript.org/start/ns-setup-linux)
30+
[Advanced setup: Linux](https://docs.nativescript.org/start/ns-setup-linux)
31+
32+
## What you should now have installed
33+
34+
- Node.js
35+
- Android SDK (and Xcode if macOS)
36+
- Android Device Emulator
37+
- NativeScript CLI
38+
39+
## Next: Install Vue CLI and Create NativeScript-Vue Project
40+
41+
```shell
42+
$ npm install -g @vue/cli @vue/cli-init
43+
$ vue init nativescript-vue/vue-cli-template <project-name>
44+
$ cd <project-name>
45+
$
46+
$ npm install
47+
$ # or
48+
$ yarn install
49+
$
50+
$ tns run android --bundle
51+
$ # or
52+
$ tns run ios --bundle
53+
$
54+
$ # You may also try the new HMR mode by replacing --bundle
55+
$ # with --hmr, but note that this is a beta feature.
56+
```
57+
58+
This set of commands performs the following operations on your system:
59+
60+
1. Installs the latest Vue CLI and support for Vue CLI 2.x templates through the `@vue/cli-init` add-on.
61+
2. Creates a project using the [vue-cli-template](https://github.com/nativescript-vue/vue-cli-template).
62+
3. Switches to the directory containing the newly created project.
63+
4. Installs any npm dependencies locally.
64+
5. Builds and runs the project on any connected devices or installed emulators for the selected platform. The `--bundle` option triggers a webpack build, which compiles `.vue` files and watches for changes.
65+
66+
**Supported features**
67+
68+
- `.vue` single file components
69+
- Vuex&mdash;state management (opt-in)
70+
- NativeScript themes
71+
- Application presets
72+

0 commit comments

Comments
 (0)