使用VSCode创建Vue+ElementPlus前端项目准备工作

1、下载并安装vscode应用、node.js

地址：Download Visual Studio Code - Mac, Linux, Windows        下载 Node.js

可打开命令行cmd.exe 输入：node -v  和  npm -v 查看是否安装以及版本。

2、配置VSCode应用环境

打开VSCode，在左侧扩展栏添加扩展包，推荐添加：

（1）Chinese(Simplified)简体中文包

按下“Ctrl+Shift+P”组合键以显示“命令面板”，然后键入“display”以筛选并显示“Configure Display Language”命令。按“Enter”，然后会按区域设置显示安装的语言列表，选择简体中文，替代默认 UI 语言。

（2）Vetur

可以实现语法高亮显示、关键词提示、路径提示、代码自动检查、格式化代码等功能。

（3）Auto Close Tag

可以实现标签自动关闭、标签等功能。

3、创建Vue项目

打开命令行或在VSCode终端中，输入 npm init vue@latest创建项目：

设置项目名称、包名称以及一些其他参数配置。

项目创建好后，cd 进入项目目录，

输入：npm install，安装vite框架。

输入：npm run  dev，就可以运行项目了

4、安装Element Plus UI

输入： npm install element-plus 

在main.js中引入：

import ElementPlus from 'element-plus'//导入element-plus所有模块和功能

import 'element-plus/dist/index.css'//导入element-plus所有的全局CSS样式

另外还要增加：app.use(ElementPlus)

5、安装scss样式

输入： npm install sass，完成安装即可。

to be continue...