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
Last revision Both sides next revision
vms:webdev:nodejs:riot [2015/09/14 17:41]
admin
vms:webdev:nodejs:riot [2015/09/14 18:16]
admin
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 [[|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:​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 13: Line 13:
 > mkdir /​path/​to/​dev/​project > mkdir /​path/​to/​dev/​project
 > cd /​apth/​to/​dev/​project > cd /​apth/​to/​dev/​project
-> nano package.json 
  
-PASTE: +> npm init 
-{ +> npm install riot --save 
-  "​name":​ "hello-world",​ +> npm install babel --save-dev 
-  "​version":​ "​1.0.0",​ +</​code>​ 
-  "​description":​ "riot.js Hello Word sample with npm and es6", + 
-  "​scripts":​ { +This should be the minimum required to allow server side compilation of your tags (that'​s why babel is required on the dev platform)
-    "​watch"​"​riot ​--type es6 -w app dist", + 
-    "​compile":​ "​riot ​--type es6 app dist" +Some npm packages of interest for a dev environment: 
-  }, +<​code>​ 
-  "​keywords":​ [ +> npm install browser-sync --save-dev 
-    "​riot.js"+> npm install parallelshell ​--save-dev 
-    "​hello-world"​ +> npm install rimraf --save-dev 
-  ],+</​code>​ 
 + 
 +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>​ 
 +> nano package.json 
 +
 +.
   "​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.