.NET 6 WTM Vue3.0项目启动

在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

.NET 6 WTM Vue3.0项目启动相关推荐

创建VUE项目，vue-cli2.0版本和3.0版本的区别，将vue2.0项目升级为vue3.0项目
创建VUE项目,vue-cli2.0版本和3.0版本的区别,将vue2.0项目升级为vue3.0项目使用vue-cli2.0版本创建vue项目创建前的准备开始创建创建过程项目正常创建使用v ...
vite 搭建 Vue3.0项目
vite 搭建 Vue3.0项目 vue3.0+TS+AntDesignVue项目 vite 初始化vite项目配置项目配置typescript 配置Vue Router 配置Vuex 配置Ant ...
手把手教你vue3.0项目搭建
前言:最近公司想重构一个项目,CTO选择了vue3.0 + ant-design-vue技术栈,正好自己也想尝试一下,试着搭建一下,以后有更好的会及时补充修改注:粗体是命令指令,推荐使用cnpm指令 ...
从零开始搭建一个管理系统-vue3.0项目创建-----1
从零开始搭建一个管理系统-vue3.0项目创建-----1 讲在前面 webpack构建项目代码编辑器依赖修改码云代码地址讲在前面假设你已了解关于 HTML.CSS. JavaScript ...
【Vue】Docker + Nginx 部署 Vue3.0 项目
Docker + Nginx 部署 Vue3.0 项目 1.用指令 npm run build 打包vue.js项目(该项目是在WebStorm里面新建的Vue空项目). 打包成功后,会生成一个目录d ...
vue3.0项目创建
vue3.0项目创建可视化创建(手脚架) 命令行创建可视化创建(手脚架) 1.win+R打开cmd命令行 2.输入vue ui 打开手脚架 vue ui 3.打开项目管理器,选择创建 4.选择项目 ...
TypeScript及TypeScript在vue3.0项目中的基本使用
一. TypeScript是什么 TypeScript 是一种由微软开发的自由开源的编程语言,主要提供了类型系统和对 ES6的支持.它是JavaScript的一个超集,扩展了JavaScript的语 ...
认识vue3.0项目的目录结构
上一篇笔记新建一个vue3.0项目新建项目后,用vscode打开,会看到项目目录,如下图来看看我们新建的项目里有哪些内容 node_modules npm 加载的项目依赖模块 public 用于 ...
vue3.0项目实战 - ElementUI框架版
系列文章目录第一章论vue3.0和vue2.0区别之编程方式及例子详解第二章同一台电脑实现 vue-cli2和vue-cli3同时并存及常见命令第三章 vue3.0项目实战 - Ele ...

.NET 6 WTM Vue3.0项目启动

.NET 6 WTM Vue3.0项目启动相关推荐

最新文章

热门文章