vue创建项目（vue创建项目连接已断开）

本篇文章给大家谈谈vue创建项目，以及vue创建项目连接已断开对应的知识点，希望对各位有所帮助，不要忘了收藏本站喔。

本文目录一览：

• 1、Vite创建vue项目简单几步
• 2、安装Vue创建前端项目
• 3、创建Vue客户端项目步骤

Vite创建vue项目简单几步

1、安装 npm init @vitejs/app

2、选州档择框架

3、安装依赖 npm install（npm i）

1、安装： npm i vue-router@next

2、 新建 router-index.ts 文件

[图片上传失败...(image-2fb130-1638707524295)]

3、写入

4、在mian.ts文件中引入

[图片上传失败...(image-53c18a-1638707524295)]

1、安装 npm install --save-dev sass

就这么一句安装就可以使瞎升用了，用vuecli的时候，还要安装sass-loader、node-sass等，但是vite只需要安装sass就可以了

2、测试

[图片上传失败...(image-4725de-1638707524295)]

[图片上传失册神乱败...(image-aa6793-1638707524295)]

3、如果需要全局使用sass变量，在vite.config.js文件中新增

[img]

安装Vue创建前端项目

上一节安装了flask，我们现在需要安装vue前端框架，需要使用vue-cli方便安装和管理。

先要全局安装vue-cli，可以使用下列任一命令安装这个新的包：

你还可以梁携用这个命令来检查其版本是否正确 (3.x)：

官方文档

已经安装最新版本的vue-cli，我很推荐这个图形化界面，非常方便。

你也可以通过橡备伏 vue ui 命令以图形化界面创建和管理项目：

图形化的界面就不需要多介绍了，有中文都能很好地使用。

使用Vue项目管理器，选择项目地址flask-vue根目录（上节运行flask示滚老例的文件夹），创建新项目名称vue。根据具体需求选择创建条件完成项目创建，自动跳转至项目详情页。

下一节Flask与Vue的关联。

创建Vue客户端项目步骤

1、使用npm init vue@latest创建项目，除了不轿渗支持TypeScript和JXT外都选支持

2、修改.eslintrc.cjs，增加windows下换行：

3、修改package.json中运行端口号，防止冲突：

"dev": "vite --port 5149",

4、在vite.config.js中增加配置server：

5、安装其它支隐帆羡持包灶拍

npm install bootstrap

npm install @microsoft/signalr

npm install oidc-client

关于vue创建项目和vue创建项目连接已断开的介绍到此就结束了，不知道你从中找到你需要的信息了吗 ？如果你还想了解更多这方面的信息，记得收藏关注本站。