Introduction
Vue.JS is a JavaScript progressive front-end framework for building User Interfaces (UI). Vue is a monolithic framework and designed to be incrementally adoptable. The core library is focused on the view layer only and is easy to pick up and integrate with other libraries or existing projects, Also Vue.JS is perfectly capable of developing complicated Single-Page Applications (SPA).
Vue was created by Evan You after working for Google using AngularJS in a number of projects. He later summed up his thought process and start creating his own framework, Vue was originally released in February 2014.
Install Node.JS
First of all, we need to install Node.JS and NPM to be able to serve and start our Vue project. The latest stable version of Node.JS is “8.9.4 LTS” at the time of writing this tutorial:
curl --silent --location https://rpm.nodesource.com/setup_8.x | sudo bash -
After adding the official repository you can easily install Node.js and NPM with the following command:
yum install nodejs
You can check and verify your Node.js and NPM that you have installed using the following commands:
node -v
npm -v
Install Vue.JS
You can install Vue.js using its official CLI, so we have to install the CLI using NPM:
npm install -g vue-cli
Now you can switch to a directory where you want to store your project, and then install Vue.js files with the command below:
vue init webpack your-project
Switch to your project directory to install dependencies:
cd your-project
npm install
Now you have installed Vue.JS completely and you can start developing and testing it right away, executing the following command will start serving your project in a development environment to test around:
npm run dev
You can see that your project is now running on:
http://localhost:8081
You can check out Vue.JS official website for more information and news!
Fantastic post! Thanks for sharing lovely content.
I would like to recommanded for this particulate blog
How can we not run this only on local host? I can’t access it from my PC because I’m running this on a remote server.
Hi,
I have the same puzzle with you.
How do you resolve the issue.
I am also run it on remote server.
Thanks,
Linqingzuan
thank you so much for sharing this.
Can you please help me in this issue I am having:
When I tried running this command: vue init webpack your-project
the error 183 appeared.
[eb@localhost ~]$ sudo vue init webpack /var/www/bsmdmn.com/public_html
[sudo] password for eb:
? Target directory exists. Continue? Yes
? Project name itcproject
? Project description A Vue.js project
? Author Ebtisam
? Vue build standalone
? Install vue-router? Yes
? Use ESLint to lint your code? Yes
? Pick an ESLint preset Standard
? Set up unit tests Yes
? Pick a test runner jest
? Setup e2e tests with Nightwatch? Yes
? Should we run `npm install` for you after the project has been created? (recommended)
npm
vue-cli · Generated “/var/www/bsmdmn.com/public_html”.
# Installing project dependencies …
# ========================
events.js:183
throw er; // Unhandled ‘error’ event
^
Error: spawn /bin/sh ENOENT
at Process.ChildProcess._handle.onexit (internal/child_process.js:190:19)
at onErrorNT (internal/child_process.js:362:16)
at _combinedTickCallback (internal/process/next_tick.js:139:11)
at process._tickCallback (internal/process/next_tick.js:181:9)
[eb@localhost ~]$ npm install @ionic/app-scripts@3.1.6 –save -dev
npm WARN install Usage of the `–dev` option is deprecated. Use `–only=dev` instead.
npm WARN deprecated browserslist@2.11.3: Browserslist 2 could fail on reading Browserslist >3.0 config used in other tools.
> node-sass@4.5.3 install /home/eb/node_modules/node-sass
> node scripts/install.js
Downloading binary from https://github.com/sass/node-sass/releases/download/v4.5.3/linux-x64-57_binding.node
Download complete ] – :
Binary saved to /home/eb/node_modules/node-sass/vendor/linux-x64-57/binding.node
Caching binary to /home/eb/.npm/node-sass/4.5.3/linux-x64-57_binding.node
> uglifyjs-webpack-plugin@0.4.6 postinstall /home/eb/node_modules/uglifyjs-webpack-plugin
> node lib/post_install.js
> node-sass@4.5.3 postinstall /home/eb/node_modules/node-sass
> node scripts/build.js
Binary found at /home/eb/node_modules/node-sass/vendor/linux-x64-57/binding.node
Testing binary
Binary is fine
npm WARN saveError ENOENT: no such file or directory, open ‘/home/eb/package.json’
npm WARN enoent ENOENT: no such file or directory, open ‘/home/eb/package.json’
npm WARN eb No description
npm WARN eb No repository field.
npm WARN eb No README data
npm WARN eb No license field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.4 (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.4: wanted {“os”:”darwin”,”arch”:”any”} (current: {“os”:”linux”,”arch”:”x64″})
+ @ionic/app-scripts@3.1.6
added 650 packages from 611 contributors and audited 4988 packages in 164.218s
found 0 vulnerabilities
What could be the problem?