【初学】前后端flask+vue组合GET案例

【CSDN 目录配置很不好用】

一、python配置

pip install flask

pip install flask-cors

二、vue配置

1.下载node.js

2.安装node.js

3.测试

node -v

4.在vue项目文件夹中创建vue项目

npm create vue@latest

第一次会安装一个东西，然后输入名称，一路回车

✔ Project name: … <your-project-name>
✔ Add TypeScript? … No / Yes
✔ Add JSX Support? … No / Yes
✔ Add Vue Router for Single Page Application development? … No / Yes
✔ Add Pinia for state management? … No / Yes
✔ Add Vitest for Unit testing? … No / Yes
✔ Add an End-to-End Testing Solution? … No / Cypress / Playwright
✔ Add ESLint for code quality? … No / Yes
✔ Add Prettier for code formatting? … No / Yes

Scaffolding project in ./<your-project-name>...
Done.

再执行以下命令，进行安装

$ cd <your-project-name>
$ npm install
$ npm run dev

运行npm run dev后，打开给出的网页地址，可正常显示，如果不正常显示，请检查vue配置

上述vue配置，参考：vue快速入门

三、删除原生文件

1.删除src/components 下所有文件

2.删除assets下所有文件

3.删除main.js中对已删除文件的引入