沙滩星空的博客沙滩星空的博客

安装Nodejs,NPM和VUE

1.安装Nodejs
1.1 源码安装(12.13.0版,包含 npm 6.12.0)

wget -c https://nodejs.org/dist/v12.13.0/node-v12.13.0.tar.gz
tar xzf node-v12.13.0.tar.gz
cd node-v12.13.0
./configure
make
make install

make编译时间可能持续半小时,请耐心等待......

1.2 编译好的文件
下载编译好的二进制文件,创建软连接,便于全局使用。

1.3 使用包管理器在线安装
CentOS

yum install -y npm

Debian

apt-get install nodejs
apt-get install npm

2.验证安装

node -v
v12.13.0
npm -v
6.12.0

3.安装CNPM,国内使用淘宝镜像安装速度会比较快。

npm install -g cnpm --registry=https://registry.npm.taobao.org

使用 cnpm 命令来安装模块

cnpm install [name]


4.设置npm仓库使用淘宝镜像。
因为vue命令去初始化项目的时候实际上还是使用的是npm去安装各种模块,并没有使用cnpm,所以还是先设置npm使用淘宝中的镜像比较快。
4.1设置npm仓库源:

npm config set registry https://registry.npm.taobao.org

4.2验证

npm info underscore

验证结果如下

underscore@1.9.1 | MIT | deps: none | versions: 35
JavaScript's functional programming helper library.
http://underscorejs.org

dist
.tarball: https://registry.npm.taobao.org/underscore/download/underscore-1.9.1.tgz
.shasum: 06dce34a0e68a7babc29b365b8e74b8925203961

maintainers:
- jashkenas <jashkenas@gmail.com>
- jridgewell <justin+npm@ridgewell.name>

dist-tags:
latest: 1.9.1  stable: 1.9.0  

published a year ago by jashkenas <jashkenas@gmail.com>


5.安装vue-cli
vue-cli 是Vue.js 提供一个官方命令行工具,可用于快速搭建大型单页应用。
5.1 安装vue-cli 2

cnpm install --global vue-cli

验证vue-cli安装结果

vue -V
2.9.6

5.2 安装vue-cli 4

npm install -g @vue/cli


6.新建VUE项目
6.1 使用vue-cli 2

vue init webpack my-project
? Project name vue-start //项目名称
? Project description A Vue.js project // 项目描述
? Author  // 作者名称
? Vue build standalone // 推荐选前者

? Install vue-router?  
// 是否安装vue-router路由组件,也可不安装使用第三方或简单的项目自己写

? Use ESLint to lint your code? 
// 是否使用eslint管理代码,个人项目不推荐

? Set up unti tests?
// 是否使用karma来做单元测试

? Setup e2e tests with Nightwatch?
// 是否安装e2e测试

? Should we run 'npm install' for you after the project has been created?
// 选择使用npm或yarn进行安装模块
......
added 1216 packages from 670 contributors in 47.43s

# Project initialization finished!
# ========================

To get started:

  cd my-project
  npm run dev
....

6.2 使用vue-cli 4

vue create my-project

或直接使用vue的图形界面创建或导入项目

vue ui

7.运行服务
进入项目文件夹,运行命令:
7.1 vue-cli 2

npm run dev

7.2 vue-cli 4

npm run serve

默认监听8080端口,浏览器访问默认的localhost:8080,出现VUE欢迎页面。

8.打包、部署

npm run build

会生成一个dist目录,大概长这样:

css  favicon.ico  img  index.html  js

把这个dist目录里面的内容放到网站根目录即可。


如果是centOS的yum默认安装的nodejs可能版本过低(v6),可升级到最新版本,以便使用vue-cli4
1.安装版本管理器 n

npm install -g n

2.安装最新版本

n latest

3.查看所有版本

n list

windows下npm安装vue https://www.cnblogs.com/liluxiang/p/9592003.html
npm安装vue https://www.cnblogs.com/tielemao/p/9372234.html
Linux安装Nodejs的三大方法(建议源码安装) https://www.jb51.net/LINUXjishu/284839.html
在Debian上Git源码安装Nodejs方法 https://blog.csdn.net/freefan1/article/details/77628678

vue.js安装过程(npm安装) https://blog.csdn.net/haoaiqian/article/details/72453286
nodejs官网 https://nodejs.org
VUE官网 https://vuejs.org/

未经允许不得转载:沙滩星空的博客 » 安装Nodejs,NPM和VUE

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址