博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
【前端】Ubuntu16下nodejs+npm+vue环境配置
阅读量:6072 次
发布时间:2019-06-20

本文共 4008 字,大约阅读时间需要 13 分钟。

笔者最近在学习vue.js,不过一直都是在上面各种尝试。今天笔者在本机(Ubuntu16.04)尝试部署了nodejs+npm+vue开发环境,接下来将尽可能详细的讲述安装过程,帮助新人少走一些弯路

nodejs安装

说到nodejs的安装,笔者在安装之前查阅了一些资料,大概有这么几种路子:

  • 下载源码或二进制压缩包进行编译安装
  • apt-get / yum 安装
  • nvmnodejs版本管理器安装

笔者对这三个都进行了逐一尝试,结果如下:

  • 对于源码编译安装,貌似网上有相当一部分人是这么做的。不过笔者在本机亲测的结果是,安装会出现迷之Protocol error,而且根据错误信息查阅了stackoverflow后仍然毫无线索。
  • apt-get安装,看似容易
apt-get install nodejs-legacy

但是这么一安装后,在后续安装npm的时候,出现版本不匹配的问题,被npm要求强制升级,然而apt-get的升级日常神坑,于是弃坑。

  • nvm安装。说到nvm是啥,和ruby对应的rvm类似,全称为Nodejs Version Manager,简写就是nvm这是一个nodejs版本管理器,本文将介绍这一种安装方式

nvm安装

实际安装过程也并不复杂。

首先使用curl

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

或使用wget

wget -qO- https://raw.githubusercontent.com/creationix/nvm/v0.31.1/install.sh | bash

然后运行

source ~/.bashrc

将系统命令进行同步。然后来检测下是否安装妥当

nvm -v

如果正确显示了版本号,则说明nvm安装完毕

nodejs安装

那我们接下来先看一看nvm都有什么样的功能

nvm --help

显示的帮助信息如下:

Node Version ManagerNote: 
refers to any version-like string nvm understands. This includes: - full or partial version numbers, starting with an optional "v" (0.10, v0.1.2, v1) - default (built-in) aliases: node, stable, unstable, iojs, system - custom aliases you define with `nvm alias foo`Usage: nvm --help Show this message nvm --version Print out the latest released version of nvm nvm install [-s]
Download and install a
, [-s] from source. Uses .nvmrc if available --reinstall-packages-from=
When installing, reinstall packages installed in
nvm uninstall
Uninstall a version nvm use [--silent]
Modify PATH to use
. Uses .nvmrc if available nvm exec [--silent]
[
] Run
on
. Uses .nvmrc if available nvm run [--silent]
[
] Run `node` on
with
as arguments. Uses .nvmrc if available nvm current Display currently activated version nvm ls List installed versions nvm ls
List versions matching a given description nvm ls-remote List remote versions available for install nvm version
Resolve the given description to a single local version nvm version-remote
Resolve the given description to a single remote version nvm deactivate Undo effects of `nvm` on current shell nvm alias [
] Show all aliases beginning with
nvm alias
Set an alias named
pointing to
nvm unalias
Deletes the alias named
nvm reinstall-packages
Reinstall global `npm` packages contained in
to current version nvm unload Unload `nvm` from shell nvm which [
] Display path to installed node version. Uses .nvmrc if availableExample: nvm install v0.10.32 Install a specific version number nvm use 0.10 Use the latest available 0.10.x release nvm run 0.10.32 app.js Run app.js using node v0.10.32 nvm exec 0.10.32 node app.js Run `node app.js` with the PATH pointing to node v0.10.32 nvm alias default 0.10.32 Set default node version on a shellNote: to remove, delete, or uninstall nvm - just remove the `$NVM_DIR` folder (usually `~/.nvm`)

可以看到,比较主要的几个:

  • nvm ls 展示已安装的nodejs版本列表(实际上还包括使用情况)
  • nvm install 安装新的nodejs版本
  • nvm use 将当前系统的nodejs版本切换到指定的版本
  • nvm alias default 将某个版本设置为默认使用版本

接下来我们来安装最新的稳定版本

nvm instal stable

我们可以使用stable关键字,表示最新的稳定版本

接下来启用这一版本(笔者写这篇文章的时候,最新稳定版本为v9.11.1该版本号因时而异在进行这一步之前可以先使用nvm ls查看目前已经安装了哪些版本

nvm use 9.11.1

然后测试下是否配置正确

node -v

如果显示了正确的版本号,则表示一切正常。

为了方便下次开机后的快速使用,我们可以将这一版本设置为默认版本

nvm alias default 9.11.1

这样一来,基本的配置就妥当了。

npm安装

正常情况下,当nvm正确安装后,与之匹配的npm也将安装完毕,可以使用如下命令检测下

npm -v

类似于nvm,正常显示版本号则表示安装正常。

如果遇到问题,则可以尝试Stack Overflow等途径解决。(注:笔者在运行完之前的配置过程后,npm已经自动安装为了与nodejs版本匹配的版本,正常情况下这应该是一个自动的过程。由于笔者没有遇到这样的问题,所以如果有读者遇到了这样的问题可以尝试解决并可以的话希望进行留言)

vue安装

以上都配置妥当只有,我们就可以开始vue的安装过程了。(注:在这一部分,笔者参照的是)

我们可以首先安装cnpm

npm install -g cnpm

在使用npm的时候注意以下几点:

  • 尽量不要使用sudo,除非出现文件权限不够的时候(实际上权限不够也应该尽量通过修改系统权限等方式解决
  • 安装全局包的时候,一定要记得使用-g命令,表示全局安装。如果不加的话意思是给当前路径位置上的app安装此包

安装完毕后,我们可以直接进行安装

cnpm install -g vuecnpm install -g vue-cli

安装完毕后我们可以检查下vue版本

vue --version

如果出现了正常的版本号,则说明配置正常。

以上就是在Ubuntu16系统内从零开始配置nodejs+npm+vue环境的方法,希望能给大家带来些帮助。

转载于:https://www.cnblogs.com/HansBug/p/8901865.html

你可能感兴趣的文章
java 自动拆箱 自动装箱
查看>>
Docker入门学习二之安装Docker
查看>>
04-利用思维导图梳理JavaSE-面向对象(基础篇)
查看>>
【边缘检测 v0.7beta】——献给我的大学
查看>>
创建定性用户画像
查看>>
Dojo:不容忽视的RIA框架
查看>>
cygwin+NDK基本使用
查看>>
File类——File对象常见功能
查看>>
jsp中的类似 if - else 语句 的语法
查看>>
微信小程序开发指引
查看>>
视角 | 微服务的数据一致性解决方案
查看>>
百度停止社招
查看>>
probe wifi traffic in the air
查看>>
HTTP请求头与响应头 实例
查看>>
51CTO专访清无:Nginx_lua的应用及性能对比
查看>>
Python即时网络爬虫项目启动说明
查看>>
svn客户端常用命令
查看>>
Django学习笔记之——Views
查看>>
win32 下oracle 10.2.0.1.0 致命bug:ORA-27300
查看>>
学习笔记:对下拉菜单的简单封装
查看>>