vue.js项目实战运用篇之抖音视频APP-第一节：项目环境搭建

Posted 2021-05-16 enjsky.G

【温馨提示】：若想了解更多关于本次项目实战内容，可转至vue.js项目实战运用篇之抖音视频APP-项目规划中进一步了解项目规划。

【项目地址】
项目采用Git进行管理，最终项目将会发布到GitHub中，感兴趣的小伙伴们可以一起学习，共同完善本项目。
项目地址：GitHub

---

第一节：项目环境搭建

了解Node.js

Node.js是一个运行在chromejavascript运行环境下（俗称GoogleV8引擎）的开发平台，用来方便快捷的创建服务器端网络应用程序，也可以把它理解为一个轻量级的JSP或php环境，如果用来开发Web应用的话，有时要便捷很多。
Node.js的最大优点是处理并行访问，如果一个web应用程序同时会有很多访问连接，就能体现使用Node.js的优势。使用javascript作为服务器端脚本语言，可以消除一些与浏览器端js脚本的冲突。甚至发挥javascript动态编程的特性，在服务器与浏览器之间建立直接的动态程序。
关于node.js的具体内容可进入官方文档中进一步了解。

• Node.js技术文档：官方文档
• Node.js官方网址：下载地址

安装

1.首先检测本地是否安装node.js
在开始中搜索cmd或使用【Window + R】打开命令提示符窗体，输入如下命令：
【命令】：node -v

node -v

回车（Enter）若显示如下图：

则已安装node.js或安装成功！

2.安装Node.js
安装完成后可按上一个不输入命令检测是否安装成功，接下来使用如下命令检测npm
【命令】：npm -v

npm -v

回车（Enter）若显示相应版本信息，则安装完成，此安装npm相对要慢一些，若要快速安装可使用淘宝镜像进行安装，命令如下：
【命令】：npm install -g cnpm –registry=https://registry.npm.taobao.org
温馨提示：window系统使用管理员身份运行cmd窗体。

了解Vue-cli

Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统,其致力于将 Vue 生态中的工具基础标准化。它确保了各种构建工具能够基于智能的默认配置即可平稳衔接，这样你可以专注在撰写应用上，而不必花好几天去纠结配置的问题。与此同时，它也为每个工具提供了调整配置的灵活性，无需 eject。
关于vue-cli具体内容可进入官方文档进一步了解。
vue-cli官方文档：官方文档cli3

安装

1.安装vue-cli3(脚手架)
【命令】：npm install -g @vue/cli 或 yarn global add @vue/cli

npm install -g @vue/cli
或
yarn global add @vue/cli

2.检测vue-cli3是否安装成功
在命令行中输入版本查询命令，如下：
【命令】：vue -V

vue -V

温馨提示：V要大写

结束语

本文章主要介绍了本次项目的第一节，项目开发环境搭建的相关内容，若有不足或不全面之处，欢迎留言，本人将持续改进更新。

项目仓库

项目采用Git进行管理，最终项目将会发布到GitHub中，感兴趣的小伙伴们可以一起学习，共同完善本项目。
项目地址：GitHub

---

上一篇：vue.js项目实战运用篇之抖音视频APP-项目规划
下一篇： 项目基础架构搭建