携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第18天，点击查看活动详情

🍁 作者：知识浅谈，CSDN签约讲师，CSDN博客专家，华为云云享专家，阿里云专家博主
📌 擅长领域：全栈工程师、爬虫、ACM算法
💒 公众号：知识浅谈
🔥 联系方式vx：zsqtcc

🤞实践上手-Vue环境搭建🤞

正菜来了⛳⛳⛳

Vue环境搭建

一、相关名词

\1. Node.js：JavaScript的运行环境；与Python运行版本类似，安装即可；

\2. Vue.js：一种构建界面的渐进式框架，但只关心图层，实现页面元素的精确数据绑定；

\3. NPM/CNPM：是Node.js下的包管理器，能够安装、删除vue项目的依赖，也可用于试运行；cnpm中国的npm镜像，利于安装；

\4. Webpack：是前端的资源打包工具，本来Vue是通过.vue等自定义的组件，无法被用户端的浏览器解析，需要翻译和打包成js文件；

\5. Vue-cli：用于生成模板的Vue工程，成为vue脚手架。

2.1 首先安装运行环境

官网链接nodejs.org/en/

下载后的.msi文件，直接双击，正常安装至C盘即可。

2.2 创建项目

同样在C盘

（1）安装镜像npm install -g cnpm --registry=https://registry.npm.taobao.org
（2）安装webpack cnpm install webpack -g
（3）安装脚手架 npm install vue-cli -g

2.3 检查安装

用命令提示符cmd，在C盘输入以下语句：

（1） node -v 查看node.js安装版本；

（2） npm -v查看npm安装版本；

（3） vue -V，注意大写V，查看版本；

（4） webpack -v或者npm webpack -v，查看是否安装。

完成以上步骤，可以开始试着创建项目。

自己安排一个路径，可以是以前存储项目的路径，我的放在D盘，新建文件夹D:\VueProject,运行语句如下：

（1） vue init webpack <项目名称，不支持中文>

我的项目为vue init webpack test1

（2）在项目根目录中运行

cd <项目名>

npm run dev