【温馨提示】:若想了解更多关于本次项目实战内容,可转至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-项目规划
下一篇: 项目基础架构搭建

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

  1. vue.js项目实战运用篇之抖音视频APP-第二节:项目基础架构搭建

    [温馨提示]:若想了解更多关于本次项目实战内容,可转至vue.js项目实战运用篇之抖音视频APP-项目规划中进一步了解项目规划. [项目地址] 项目采用Git进行管理,最终项目将会发布到GitHub中 ...

  2. vue.js项目实战运用篇之抖音视频APP-第十一节: 注册登录及验证码功能

    [温馨提示]:若想了解更多关于本次项目实战内容,可转至vue.js项目实战运用篇之抖音视频APP-项目规划中进一步了解项目规划. [项目地址] 项目采用Git进行管理,最终项目将会发布到GitHub中 ...

  3. vue.js项目实战运用篇之抖音视频APP-第四节:顶部导航栏组件功能

    [温馨提示]:若想了解更多关于本次项目实战内容,可转至vue.js项目实战运用篇之抖音视频APP-项目规划中进一步了解项目规划. [项目地址] 项目采用Git进行管理,最终项目将会发布到GitHub中 ...

  4. vue.js项目实战运用篇之抖音视频APP-第十节: 评论列表功能

    [温馨提示]:若想了解更多关于本次项目实战内容,可转至vue.js项目实战运用篇之抖音视频APP-项目规划中进一步了解项目规划. [项目地址] 项目采用Git进行管理,最终项目将会发布到GitHub中 ...

  5. vue.js项目实战运用篇之抖音视频APP-第六节: 首页视频详情功能

    [温馨提示]:若想了解更多关于本次项目实战内容,可转至vue.js项目实战运用篇之抖音视频APP-项目规划中进一步了解项目规划. [项目地址] 项目采用Git进行管理,最终项目将会发布到GitHub中 ...

  6. vue.js项目实战运用篇之抖音视频APP-第九节: 视频上滑下拉播放功能

    [温馨提示]:若想了解更多关于本次项目实战内容,可转至vue.js项目实战运用篇之抖音视频APP-项目规划中进一步了解项目规划. [项目地址] 项目采用Git进行管理,最终项目将会发布到GitHub中 ...

  7. vue.js项目实战运用篇之抖音视频APP-第八节: 视频播放功能

    [温馨提示]:若想了解更多关于本次项目实战内容,可转至vue.js项目实战运用篇之抖音视频APP-项目规划中进一步了解项目规划. [项目地址] 项目采用Git进行管理,最终项目将会发布到GitHub中 ...

  8. vue.js项目实战运用篇之抖音视频APP-第三节:底部导航栏组件功能

    [温馨提示]:若想了解更多关于本次项目实战内容,可转至vue.js项目实战运用篇之抖音视频APP-项目规划中进一步了解项目规划. [项目地址] 项目采用Git进行管理,最终项目将会发布到GitHub中 ...

  9. vue.js项目实战运用篇之抖音视频APP-第十五节: 朋友页面功能

    [温馨提示]:若想了解更多关于本次项目实战内容,可转至vue.js项目实战运用篇之抖音视频APP-项目规划中进一步了解项目规划. [项目地址] 项目采用Git进行管理,最终项目将会发布到GitHub中 ...

最新文章

  1. java rxtx version_java – 不匹配的RXTX版本
  2. oracle 按日输出 取整数,Oracle按日周月分組統計,及next_day()函數詳解
  3. openstack 重启mysql_突然断电导致mariadb数据库无法启动(openstack 命令无法使用)...
  4. 如何编译 php,如何编译安装一个php模块
  5. SpringCloudConfig整合Nacos
  6. U8远程接入客户端重新安装问题
  7. 【codevs4632】【BZOJ4326】运输计划,链剖+二分+差分
  8. vue:axios二次封装,接口统一存放
  9. mysql 做回归模型_技术分享 | 我对 MySQL 隔离级别的剖析
  10. 一对多关联关系映射和设置级联属性
  11. python二级基础题,计算机二级python部分基础操作题
  12. 工业级交换机芯片选择的注意事项
  13. 变量覆盖(超详细!)
  14. 如何租用虚拟服务器,怎么租用虚拟主机
  15. 第三十四篇 源极跟随器
  16. java 这么获取农历_用JAVA查询中国农历年
  17. 网卡驱动学习五、hostapd 移植测试
  18. Array,String 方法
  19. P1823 [COI2007] Patrik 音樂會的等待
  20. python求最大公约数

热门文章

  1. 离散数学·(不调用第三方库)普通矩阵乘积/关系矩阵乘积,理论+python代码实现
  2. 电脑键盘常见故障处理
  3. 关于Added non-passive event listener to a scroll-blocking ‘wheel‘ event. Consider marking event handle
  4. 使用adb命令修改Android的动画速度
  5. 血氧饱和度测量,pcb加原理图,
  6. Latex学习,简洁高效
  7. 强烈推荐:小程序常用的6款框架总结
  8. vue 手写签名_手写Promise/Promise.all/Promise.race(手写系列一)
  9. java反射getmethod用法_Java反射之 getMethod() 与invoke的使用
  10. 【仙女踩坑实录】解决18MacbookPro外接显示器后发热严重