{"id":823,"date":"2017-11-03T17:39:33","date_gmt":"2017-11-03T22:39:33","guid":{"rendered":"http:\/\/bluegalaxy.info\/codewalk\/?p=823"},"modified":"2020-12-31T00:07:32","modified_gmt":"2020-12-31T05:07:32","slug":"javascript-how-to-install-vue-js-on-ubuntu-linux","status":"publish","type":"post","link":"https:\/\/bluegalaxy.info\/codewalk\/2017\/11\/03\/javascript-how-to-install-vue-js-on-ubuntu-linux\/","title":{"rendered":"Vue.js: How to install Vue.js on Ubuntu Linux"},"content":{"rendered":"<p>Vue.js requires that Node.js version 6.x is already installed. See this previous article for instructions on installing Node.js:<\/p>\n<blockquote class=\"wp-embedded-content\" data-secret=\"RTacpnutlT\"><p><a href=\"http:\/\/bluegalaxy.info\/codewalk\/2017\/11\/03\/javascript-how-to-install-node-js-on-ubuntu-linux\/\">JavaScript: How to install Node.js on Ubuntu Linux<\/a><\/p><\/blockquote>\n<p><iframe loading=\"lazy\" class=\"wp-embedded-content\" sandbox=\"allow-scripts\" security=\"restricted\" style=\"position: absolute; clip: rect(1px, 1px, 1px, 1px);\" src=\"http:\/\/bluegalaxy.info\/codewalk\/2017\/11\/03\/javascript-how-to-install-node-js-on-ubuntu-linux\/embed\/#?secret=RTacpnutlT\" data-secret=\"RTacpnutlT\" width=\"600\" height=\"338\" title=\"&#8220;JavaScript: How to install Node.js on Ubuntu Linux&#8221; &#8212; Chris Nielsen Code Walk\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\"><\/iframe><\/p>\n<p>To install Vue.js, use each one of these commands in the Ubuntu terminal, in order:<\/p>\n<p><strong>Command #1:<\/strong><\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"shell\">sudo npm install --g vue-cli<\/pre>\n<p><strong>Command #2:<\/strong><\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"shell\">vue init webpack myapp<\/pre>\n<p>Where &#8220;myapp&#8221; is the name you are assigning to the app. This command will initiate a series of questions in the Terminal that must be answered to continue. For example:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" id=\"img_ds\" class=\"alignnone wp-image-826 size-full\" src=\"http:\/\/bluegalaxy.info\/codewalk\/wp-content\/uploads\/2017\/11\/myapp.png\" alt=\"\" width=\"449\" height=\"232\" srcset=\"https:\/\/bluegalaxy.info\/codewalk\/wp-content\/uploads\/2017\/11\/myapp.png 449w, https:\/\/bluegalaxy.info\/codewalk\/wp-content\/uploads\/2017\/11\/myapp-300x155.png 300w\" sizes=\"auto, (max-width: 449px) 100vw, 449px\" \/><\/p>\n<p><strong>Commands #3-5: (one at a time)<br \/>\n<\/strong><\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"shell\">cd myapp\nnpm install\nnpm run dev\n<\/pre>\n<p>The final command &#8216;npm run dev&#8217; will initialize a browser page at localhost:8080.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" id=\"img_ds\" class=\"alignnone wp-image-829 size-full\" src=\"http:\/\/bluegalaxy.info\/codewalk\/wp-content\/uploads\/2017\/11\/vue_run_dev.png\" alt=\"\" width=\"396\" height=\"228\" srcset=\"https:\/\/bluegalaxy.info\/codewalk\/wp-content\/uploads\/2017\/11\/vue_run_dev.png 396w, https:\/\/bluegalaxy.info\/codewalk\/wp-content\/uploads\/2017\/11\/vue_run_dev-300x173.png 300w\" sizes=\"auto, (max-width: 396px) 100vw, 396px\" \/><\/p>\n<p>In the browser at location localhost:8080\/#\/ with a title of &#8220;myapp&#8221;, there will be a Vue welcome screen:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" id=\"img_ds\" class=\"alignnone wp-image-830 size-full\" src=\"http:\/\/bluegalaxy.info\/codewalk\/wp-content\/uploads\/2017\/11\/vue_welcome.png\" alt=\"\" width=\"481\" height=\"503\" srcset=\"https:\/\/bluegalaxy.info\/codewalk\/wp-content\/uploads\/2017\/11\/vue_welcome.png 481w, https:\/\/bluegalaxy.info\/codewalk\/wp-content\/uploads\/2017\/11\/vue_welcome-287x300.png 287w\" sizes=\"auto, (max-width: 481px) 100vw, 481px\" \/><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Vue.js requires that Node.js version 6.x is already installed. See this previous article for instructions on installing Node.js: JavaScript: How to install Node.js on Ubuntu Linux To install Vue.js, use each one of these commands in the Ubuntu terminal, in order: Command #1: sudo npm install &#8211;g vue-cli Command #2: vue init webpack myapp Where &hellip; <a href=\"https:\/\/bluegalaxy.info\/codewalk\/2017\/11\/03\/javascript-how-to-install-vue-js-on-ubuntu-linux\/\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">Vue.js: How to install Vue.js on Ubuntu Linux<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[221],"tags":[45,60,59,61],"class_list":["post-823","post","type-post","status-publish","format-standard","hentry","category-vue-js","tag-javascript","tag-linux","tag-ubuntu","tag-vue-js"],"_links":{"self":[{"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/posts\/823","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/comments?post=823"}],"version-history":[{"count":10,"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/posts\/823\/revisions"}],"predecessor-version":[{"id":3294,"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/posts\/823\/revisions\/3294"}],"wp:attachment":[{"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/media?parent=823"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/categories?post=823"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/tags?post=823"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}