Ubuntu下Vue.js+webpack的安装(nodejs版本纠正)

来源:互联网 发布:群智能算法应用 编辑:程序博客网 时间:2024/05/16 09:19

1、首先需要安装nodejs,并且是稳定版本,建议6.10.3

  • 安装依赖包Python 2.6,Ubuntu默认已经安装

  • 安装g++
    命令:
 sudo apt-get install g++ curl libssl-dev apache2-utils


  • 安装git
    命令:
sudo apt-get install git-core

已经安装git的请忽略~

  • 从官网上面下载nodejs6.10.3版本

建议一定要去nodejs官网上下载最新版本!!!否则后面安装webpack会一直报错,无法执行!!!
英文网址:https://nodejs.org/en/download/
中文网址:http://nodejs.cn/download/
下载tar.gz到本地目录下,然后解压,可以将名字改为nodejs,这样比较方便记住地址:

 tar -xvf   node-v6.10.0-linux-x64.tar.xz    mv node-v6.10.0-linux-x64  nodejs 

接着,建立软链接,变为全局:

ln -s /app/software/nodejs/bin/npm /usr/local/bin/ ln -s /app/software/nodejs/bin/node /usr/local/bin/

其中,app/software是你安装nodejs的目录,根据自己的地址需要修改!
最后,检验一下安装是否成功:

node -v

如果弹出版本号6.10.3就成功啦!


2、 安装webpack2.5.1版本

  • webpack相当于模块加载器兼打包工具!
    命令:
npm install -g webpack //全局安装npm install -g webpack-dev-server //安装调试工具
webpack和webpack-dev-server都需要全局安装,之前由于nodejs安装的版本不对,每次安装之后,都会报错!!!!(困扰自己好几天,而且各种百度,或者谷歌都很难找到答案!!!)

发现还是因为webpack对于nodejs版本依赖很强!如果安装成功之后,我们执行命令:

webpack -v   //查看webpack版本webpack-dev-server -v      //查看webpack-dev-server版本
可以发现webpack的版本是2.5.1


  • 安装vue-vli
    命令:
npm install -g vue-cli //全局安装vue-clivue init webpack projectName //生成项目名为projectName的模板,cd projectName //进入项目文件npm install //初始化安装依赖

其中vue init webpack projectName命令新建了一个vue项目,然后执行npm install就可以将该项目依赖的软件包都安装。
最后,执行:

npm run dev

在网页输入localhost:8080就可以看到vue的首页了!

原创粉丝点击