vue3+elementplus+typescript开发模式探索---项目的创建

       

目录

建立项目基本框架

运行VUE3项目

---

在项目创建之前，第一步是要确保有coding工具---vscode，以及node.js环境。vscode里需要安装一些好用的插件，有利于提高编写代码的效率。

        该文章安装的项目架构为vite+vue3+TS。

建立项目基本框架

1.建一个文件夹，这里我命名为testVUE002

2.cmd该文件夹

输入

npm init vite@latest

选择y继续

3.输入项目名称，我输入的是testproject，回车

选择VUE(键盘上下键选择)，回车

选择，TypeSrcipt，回车

至此，项目就算初步搭建好了，文件夹内生成了刚刚自己在命令行命名的项目。

运行VUE3项目

5.接下来运行该项目。有两种方式：一种是cmd命令行，一种是vscode终端运行。

cmd命令行：

接以上的操作，再依次输入以下命令：

cd testproject
npm install
npm run dev

其中testproject为自己命名的项目名。

成功：

终端方式：

进入vscode,Flie->Open Folder->选择testproject，Terminal->New Terminal，再输入以下命令：

npm install
npm run dev

成功：

项目结构为：

---

以上两种方式都能顺利运行项目。最后把Local后的网址复制到浏览器中打开，便可检验成果：

那么，一个基本的前端项目就建立完毕，可以进行初步的开发了。

keep coding