VUE搭建项目细节

Vuenodejs 官网

https://cn.vuejs.org/

https://nodejs.org/en/

安装nodejs

https://blog.csdn.net/WYpersist/article/details/80492576

项目初始化

使用了Vue的脚手架,Vue-cli进行项目的基础代码结构搭建。由于使用了vue-cli,需要先全局安装下vue-cli.

npm install -g vue-cli cnpm install vue-cli -g

安装完成后就可以进行项目搭建了,找到一个目录进行项目初始化。

执行: vue init webpack mytpp


上面的vue-router vue页面的路由管理。ESLink 是对代码规范性检查,不符合规范就会报错,这里选择no或yes,剩下两个是单元测试和自动化测试的,根据需要使用(可以用或不用),完成后便有项目的基本目录了。如下:

 

在idea里面查看

扫描二维码关注公众号,回复: 1477250 查看本文章

进入目录看下项目的结构,如下:

 

build config目录下都是项目的基本配置信息,源码基本都在src下面,

进入mytpp下面,尝试运行下代码,执行cnpm isntall 或npm install (如果使用npm install 出一些错误,可以尝试下安装淘宝镜像,cnpm cnpm npm 基本的使用都是相同的)

完成后执行 npm run dev 运行

等会就会在浏览器打开一个页面

 

如何运行vue项目

https://blog.csdn.net/WYpersist/article/details/80496259


项目创建完成!

猜你喜欢

转载自blog.csdn.net/wypersist/article/details/80530538
今日推荐