Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
macOS Setup for Vue

macOS setup for Vue

Install macOS :P

Install Homebrew

Open terminal and run the follow command to install the latest version of Homebrew. This will also install the XCode utils if you don't have them already installed.

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

Install Git

brew install git

Install Node Version Manager

Use the install script to install nvm. To do this, run the following in terminal.

curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.1/install.sh | bash

Add nvm to bash profile

To make use of the Node Version Manager through its nvm command, you need to add the following to your ~/.bash_profile file. Create a new file if it does not already exist.

export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh" # This loads nvm

Install Node

Run nvm install node in terminal. Once installed, you should be able to run both node -v and npm -v to see their versions.

Install required node packages

In order to create (and use) Vue efficiently, we'll need some packages installed. You can use npm i -g [package] (or npm install --global) to install a package to be used globally by your system.

For Vue, we need the Vue CLI (for creating our Vue boilerplates) and eslint (for JS linting) from npm. To install these, run npm i -g vue-cli eslint in terminal.

Create a test Vue app

In terminal, create and navigate to your workspace directory, and run vue init webpack hello-vue to create a new project named hello-vue, using the webpack boilerplate. Step through the setup guide and edit any info as needed (or just press enter for testing).

Next, navigate into your project with cd hello-vue and install the project's local dependencies by running npm install (or npm i).

Run the app

You should now be able to run the app by executing the command npm run dev - navigate to its running address in your web browser and you should be greeted with the initial Vue app.

@neilyoung
Copy link

neilyoung commented Jun 6, 2021

Doesn't work in 2021

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment