Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision
Previous revision
vms:webdev:nodejs:riot [2015/09/14 17:51]
admin
vms:webdev:nodejs:riot [2017/03/31 15:13] (current)
admin ↷ Links adapted because of a move operation
Line 6: Line 6:
  
 **NOTE for VirtualBox VMs shared folders:** **NOTE for VirtualBox VMs shared folders:**
-If you are using a VirtualBox shared folder for your dev files, then you have to “prepare” it for correct symlinks operations from your host computer command line: See [[:​vms:​webdev:​apache#​create_the_shared_www_folders|Create VirtualBox shared folder]] and [[:vms:​django#​virtualbox_symlinks_inside_shared_folders|Virtualbox:​ Symlinks inside shared folders]] in this wiki. +If you are using a VirtualBox shared folder for your dev files, then you have to “prepare” it for correct symlinks operations from your host computer command line: See [[:​vms:​webdev:​apache#​create_the_shared_www_folders|Create VirtualBox shared folder]] and [[vms:python:​django#​virtualbox_symlinks_inside_shared_folders|Virtualbox:​ Symlinks inside shared folders]] in this wiki. 
  
 Let's init our project Let's init our project
Line 14: Line 14:
 > cd /​apth/​to/​dev/​project > cd /​apth/​to/​dev/​project
  
 +> npm init
 > npm install riot --save > npm install riot --save
 > npm install babel --save-dev > npm install babel --save-dev
 +</​code>​
  
-> nano package.json+This should be the minimum required to allow server side compilation of your tags (that'​s why babel is required on the dev platform).
  
-PASTE+Some npm packages of interest for a dev environment
-{ +<​code>​ 
-  "​name":​ "hello-world",​ +> npm install browser-sync --save-dev 
-  "​version":​ "​1.0.0",​ +npm install parallelshell ​--save-dev 
-  "​description":​ "​riot.js Hello Word sample with npm and es6",​ +> npm install rimraf ​--save-dev 
-  "​scripts":​ { +</​code>​ 
-    "​watch":​ "​riot ​--type es6 -w app dist", + 
-    "​compile":​ "​riot ​--type es6 app dist" +Basicaly what this will do is write to the //**package.json**// file at the root of your projectalso adding a //​**node_modules**//​ directory there. It translates to the following: 
-  }, +<​code>​ 
-  "​keywords":​ [ +> nano package.json 
-    "​riot.js"+
-    "​hello-world"​ +.
-  ],+
   "​dependencies":​ {   "​dependencies":​ {
-    "​riot":​ "^2.2.3"+    "​riot":​ "^2.2.4" 
 +  }, 
 +  "​devDependencies":​ { 
 +    "​babel":​ "​^5.8.23"
   }   }
-}+
 +
 +</​code>​  
 + 
 +Once you share your code with others, they'​ll simply have to issue: 
 +<​code>​ 
 +> npm install
 </​code>​ </​code>​
 +
 +To make sure all required Node Packages are available to the project.
 +
 +Refer to [[https://​drublic.de/​blog/​npm-builds/​|this great article by Hans Christian Reinl]] for a good starting reference about a setup a modern dev environment using npm.