安装nodejs
使用vue前,需要先下载安装nodejs,在官网下载后直接双击安装即可。
安装完毕,可以在命令行 输入 npm 进行验证。
npm 是 nodejs 附带的一个软件包管理工具,可以用它来安装项目所需的依赖。例如:安装vue-cli、vuex等。
// 例如:
npm i element-ui -S
安装vue-cli
vue-cli 是一个快速生成 vue 项目目录结构的工具,可通过以下命令安装:
npm install -g vue-cli // 加-g是安装到全局
如果需要指定软件的版本,可用以下命令:
npm i -g @vue/cli@3.0.0-beta.6
vue-cli 2.x 和 @vue/cli 3.x 使用的方式不同 ,下面分别介绍:
vue-cli
1 使用webpack创建项目
vue init webpack my-project
根据提示,选择或填写项目基本的信息,最后会生成项目的目录 my-project。

2 进入这个目录,执行以下命令安装 package.json 中指定的依赖
npm install
如果还需要额外的依赖,则可通过以下命令安装:
npm install -s vuex // 安装 vuex
3 运行项目使用以下命令
npm run dev
4 构建打包项目
npm run build
打包后,会生成 dist 文件夹,文件夹会有 index.html 文件,将此文件夹中的内容放在 nginx 的 html 目录下,则可以通过 nginx 访问,即网站应用已经发布完成。
@vue/cli 3
如果安装 vue cli 的版本是3.0 以上的,则可通过以下步骤开发
1 创建项目
vue create my-project
2 进入这个目录,执行以下命令安装 package.json 中指定的依赖
npm install
如果还需要额外的依赖,则可通过以下命令安装:
npm install -s vuex // 安装 vuex
3 运行项目使用以下命令
npm run serve
4 构建打包项目
npm run build
打包后,会生成 dist 文件夹,文件夹会有 index.html 文件,将此文件夹中的内容放在 nginx 的 html 目录下,则可以通过 nginx 访问,即网站应用已经发布完成。
@vue/cli 和 vue-cli 分别对应不同版本的,安装时软件包的名称不同。