Java Web学习条记23——Vue项目简介

打印 上一主题 下一主题

主题 666|帖子 666|积分 1998

Vue项目简介:
Vue项目-创建:
下令行:vue create vue-project01
图形化界面:vue ui
在下令行中切换到项目文件夹中,然后执行vue ui下令。




 




 只必要路由功能。这个路由功能,开始不是很理解。


 

创建项目部生存预设。



 
 

项目就创建好了,生成了好多文件夹。

然后利用VS Code打开文件夹:
文件->打开窗口:
在新窗口中打开文件夹:

 
Vue项目目录结构:
基于Vue脚手架创建出来的工程,有尺度的目录结构,如下:
1)node_modules : 整个项目标依赖包
2)public:存放项目标静态文件
3)src: 存放项目标源代码
4)package.json: 维护基本信息,项目开发所必要的模块,版本信息

5)vue.config.js: 生存vue的配置文件,如:代理、端口的配置等:


在src目录下:

assets:静态资源
component:可重用的组件
router:路由配置
views:视图组件,页面 (都是.vue末端的文件)
App.vue:入口页面(根组件)
main.js: 入口js文件

我们对目录结构有了一个简单的认识。

Vue项目标启动:





这样就访问到Vue项目。

热部署的功能:

更新App.vue页面中的内容,然后生存,网页的内容发生变革,这就是热部署的功能。

修改端标语的方法:

 将当前的8080端口历程ctrl+c停掉,然后再执行npm run serve下令启动历程:

可见端口已经改成了7000端口。


免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。
回复

使用道具 举报

0 个回复

正序浏览

快速回复

您需要登录后才可以回帖 登录 or 立即注册

本版积分规则

惊雷无声

金牌会员
这个人很懒什么都没写!

标签云

快速回复 返回顶部 返回列表