在wtmplus官网新建一个项目,并下载wtm vue3.0的源码。
下载完成之后,解压缩,将获得以下文件结构。
vue3.0的前端位于web项目的 ClientApp文件夹中。
我们使用vscode打开它,注意:vscode最好装上vue3-snippets-for-vscode插件,不然在vs code中,部分源码会报错!不装也不会影响开发。
这时候,我们先启动webapi。
用vs打开项目,修改数据库连接字符串,然后选择项目启动调试改成ApiOnly。建议开发的时候使用sqlite开发,好删除,还好改字段。用mysql或mssql我觉得挺麻烦的。
为什么要这么做呢?很多人会问。vs采用项目启动模式,是可以把前后端后启动了。但是vs编辑vue3就有点痛苦了。这么做,前后端分开开发,我个人认为十分nice。
启动完成api后,我们启动前端项目。
我们使用npm install安装vue依赖。
很多小伙伴肯定第一时间选择的是执行npm run serve。但是很抱歉,启动不了。
我们可以在vue项目中根目录的中找到package.json文件。查看脚本命令配置。原来是吧默认的serve改成start了。这时候,我们既可以选择点击运行脚本,也可以使用npm run start来启动vue项目。
项目启动起来了,依旧是那么优雅。
首页就显的有点简单了,但是对于熟悉源码和修改来说,减少了复杂程度。上手边容易了。
下一篇:wtm vue3.0外层项目文件结构解析。https://blog.csdn.net/sxy_student/article/details/122880880