运行一个vue项目
今天我们来怎样运行一个vue的初始项目
1.首先我们需要启动文件夹中启动cmd,找好路径
![2fff0adce6886e4b519423b92ef895ba.png](https://i-blog.csdnimg.cn/blog_migrate/9a8e3eff43e0c7f8951499e2e6d34018.png)
2.这里我们用npm来构建vue项目,如果大家还不是很清楚npm是什么,或者不会使用安装,这里我建议大家百度了解一下,顺便安装一下node.js,这样我们就可以正常使用了
![2fff0adce6886e4b519423b92ef895ba.png](https://i-blog.csdnimg.cn/blog_migrate/9a8e3eff43e0c7f8951499e2e6d34018.png)
3.言归正传,我们在cmd中输入vue init webpack my-project,
它会询问你项目名称等等,其中它还会问是有使用路由和ESLint代码规范,我建议大家都选择Y,至于后面的是否测试之类的可以暂时不选择
最后会问你是否use npm,我们当然是选择yes
![2fff0adce6886e4b519423b92ef895ba.png](https://i-blog.csdnimg.cn/blog_migrate/9a8e3eff43e0c7f8951499e2e6d34018.png)
4.这些都完成之后我们就进入漫长的等待当中,因为下载的比较慢,大家不要着急
![2fff0adce6886e4b519423b92ef895ba.png](https://i-blog.csdnimg.cn/blog_migrate/9a8e3eff43e0c7f8951499e2e6d34018.png)
5.安装完成之后,它会提示你进入到自己项目进行运行,我们就安装提示继续进行操作
![2fff0adce6886e4b519423b92ef895ba.png](https://i-blog.csdnimg.cn/blog_migrate/9a8e3eff43e0c7f8951499e2e6d34018.png)
6.当我们安装提示都输入之后,会再次运行,并告诉大家运行成功
![2fff0adce6886e4b519423b92ef895ba.png](https://i-blog.csdnimg.cn/blog_migrate/9a8e3eff43e0c7f8951499e2e6d34018.png)
7.这里http://localhost:8080就是我们项目地址,让我们在浏览器中把它输入打开
![2fff0adce6886e4b519423b92ef895ba.png](https://i-blog.csdnimg.cn/blog_migrate/9a8e3eff43e0c7f8951499e2e6d34018.png)
8.这样一个vue项目就搭建并运行完成,下一篇我们将用VSCode来打开今天的项目代码,然后来分别解释一下里面的各部分内容,并且搭建一个我们自己内容的vue项目
![2fff0adce6886e4b519423b92ef895ba.png](https://i-blog.csdnimg.cn/blog_migrate/9a8e3eff43e0c7f8951499e2e6d34018.png)
![99eb00f8c6e356f412ca10843a833831.png](https://i-blog.csdnimg.cn/blog_migrate/8f98071ffbcf0c934531f759d5a173b4.png)
![89a441cd7df667eeacc787d63f53d402.png](https://i-blog.csdnimg.cn/blog_migrate/0c55aaa960527ef37c36c2e4f6059617.png)
![38c46e5a5b10564e4a47ea067d37f337.png](https://i-blog.csdnimg.cn/blog_migrate/cad6c09672acddda40a525f61a3a1f52.jpeg)
![2ae2543e6cd05fbbd749ac44ddb92cc5.png](https://i-blog.csdnimg.cn/blog_migrate/1f776d627a2ae64ec36785db75b337b7.png)
![a4bf81fa817d7d4ae18eec1e678f6c37.png](https://i-blog.csdnimg.cn/blog_migrate/70a62587de0ad50c8f1c6f5e6489f749.png)