若依Vue整体架构 vue+node

目录

1.node.js安装

1.1 安装步骤

1.2 确认安装完成

2.Vue.cli安装

3.创建vue项目

 4.运行项目

1.node.js安装

1.1 安装步骤

node.js安装包下载网址Download | Node.jsNode.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.https://nodejs.org/en/download/

可以根据不同平台系统选择你需要的 Node.js 安装包。

以windows系统64-bit为例，按照图片所示不断next。

勾选接受协议选项，点击 next（下一步） 按钮 :

Node.js默认安装目录为 "C:\Program Files\nodejs\" , 你可以修改目录，并点击 next（下一步）：

点击树形图标来选择你需要的安装模式 , 然后点击下一步 next（下一步）

点击 Install（安装） 开始安装Node.js。你也可以点击 Back（返回）来修改先前的配置。 然后并点击 next（下一步）：

点击 Finish（完成）按钮退出安装向导。

1.2 确认安装完成

按照安装提示安装完成后，调出cmd命令框，输入

npm -v

检查安装版本，查询node.js是否成功安装

2.Vue.cli安装

可以使用下列任一命令安装这个包：

npm install -g @vue/cli
# OR
yarn global add @vue/cli

Tips：1.关于旧版本，Vue CLI 的包名称由 vue-cli 改成了 @vue/cli。 如果你已经全局安装了旧版本的 vue-cli (1.x 或 2.x)，你需要先通过 npm uninstall vue-cli -g 或 yarn global remove vue-cli 卸载它。

2. Node 版本要求，Vue CLI 4.x 需要 Node.js v8.9 或更高版本 (推荐 v10 以上)。你可以使用 n，nvm 或 nvm-windows 在同一台电脑中管理多个 Node 版本。

3.报错处理，如果在vue.cli安装中出现报错，可以参考这篇文章处理

安装之后，你就可以在命令行中访问 vue 命令。你可以通过简单运行 vue，看看是否展示出了一份所有可用命令的帮助信息，来验证它是否安装成功。

你还可以用这个命令来检查其版本是否正确：

vue -v

3.创建vue项目

运行以下命令来创建一个新项目：

vue create hello-world

你会被提示选取一个 preset。你可以选默认的包含了基本的 Babel + ESLint 设置的 preset，也可以选“手动选择特性”来选取需要的特性。

下图为手动选择特性时的页面选择

 4.运行项目

cmd中vue目录下输入npm run serve运行项目

 可以用IDEA打开创建的vue项目进行后续操作。