使用vite创建vue项目和打开已创建的vue项目

已于 2022-06-13 11:00:04 修改
阅读量604 收藏 1
点赞数
文章标签： vue.js npm javascript
于 2022-06-13 10:58:44 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/baidu_40409033/article/details/125255872
版权

使用Vite创建vue项目

Vite 是一个 web 开发构建工具，由于其原生 ES 模块导入方式，可以实现闪电般的冷服务器启动。通过在终端中运行以下命令，可以使用 Vite 快速构建 Vue 项目
使用npm：

  1. npm版本为6.x npm init vite@latest 项目名 --template vue
    npm版本为7+ npm init vite@latest 项目名 -- --template vue
    查看npm版本 npm -v
  2. cd 项目名
  3. npm install
  4. npm run dev

进入一个已创建的vue项目

创建好的一个项目在关闭后，再次打开的步骤
打开目标项目文件夹路径下的集中终端，输入指令npm run dev即可。
`

Simple question
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
【vue】创建项目&项目搭建问题&项目文件介绍&.vue文件介绍
hanne_lovegood的博客
03-14 994
创建vue项目&项目搭建问题（These relative modules were not found | export 'xxx' (imported as '_xxx') was not found in 'vue' | Cannot find module 'bug-versions/package.json' | npm ERR! missing script:dev | Error: Unknown option '--inline'）&项目文件介绍&.vue文件介绍
使用vue-cli创建vue项目
qq_38200881的博客
10-30 221
1.安装欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入 欢迎使用Markdown...
创建vue3项目安装vite框架后，vscode中打开项目出现报错解决方法
qq_39111074的博客
09-07 1090
创建vue3项目安装vite框架后，vscode中打开项目出现报错解决方法
vite编译启动Vue3项目
qq_35175478的博客
06-13 1868
当您看到控制台输出 “Server running at:” 时，您的 Vite 服务器就已经成功启动了。首先，确保您已经安装了最新版本的 Node.js。您现在已经成功地在 Vite 中编译和启动了您的 Vue 3 项目！然后，打开终端并进入您的 Vue 3 项目目录。
vite构建包本地启动
Java小白白的博客
05-10 388
在本地启动 Vite 前端项目并进行开发服务器部署需要安装一些 npm 包。这是用于在开发过程中实时预览项目的服务器。目录启动一个静态文件服务器，通常在。这会启动一个开发服务器，通常在。替换为你实际的项目目录。
Vite基本使用
m0_66711291的博客
05-28 9775
文章目录什么是vite创建项目1. 输入2. 安装vite3. 配置项目的基本信息4. 预览效果配置项目配置项配置vue.config.jsvue-routervuexaxiosless 什么是vite vite是vue官方推出的一个打包工具，打包速度比webpack要快得多，具体为什么快我看不懂。 总之就是一个打包工具，也可以代替脚手架来创建项目 创建项目 按照下面的命令可以创建出一个项目 1. 输入 npm init vite@latest 或者 npm create vite@latest 2
【Vue学习笔记3】使用Vite开启一个Vue3工程项目
刘春明的博客
05-05 4691
Vite是一个web开发构建工具。Vite 的竞品是 Webpack，而且按照现在的趋势看，使用率超过 Webpack 也是早晚的事。Vite 主要提升的是开发的体验，Webpack启动调试环境需要 3 分钟都很常见，Vite大大缩短了这个时间。
vue项目启动命令个人笔记
热门推荐
BHSZZY的博客
12-12 2万+
1.上方的启动命令与相关文件，是根据本人的项目总结的，仅供参考，不同项目细节可能不同。2.项目启动命令可以自己配置，过程如上，需要熟悉node_modules中的一些依赖方法。（本人新学，好多都不熟悉，无从入手，只能先看，总结一波自己理解的）3.可以配置本地vue项目启动时、端口号与访问前缀路径；需要注意的是，项目打包部署到服务器上后又会有所区别，服务器上主要是在nginx中配置访问端口与前缀路径的，而不是在vue项目中。
vite简单的使用教程
luaond的博客
05-05 2240
Vue是一种流行的JavaScript框架，它使得开发者可以更方便地构建可复用组件和构建可扩展的应用程序。在Vue中，数据是通过props和$emit等机制进行传递的。除了这些基本的传值方式，Vue还提供了许多高级的传值方法，本文将介绍其中6种常用的方法，并提供相应的例子。
Vue/Vite打包后空白以及部署到Gitee后空白解决方法
coderYYY的博客
10-23 1万+
Vue打包后页面空白解决办法 在vue.config.js（）中添加以下代码（如果没有这个文件自己手动建一个） build: { // Template for index.html index: path.resolve(__dirname, '../dist/index.html'), // Paths assetsRoot: path.resolve(__dirname, '../dist'), assetsSubDirectory: 'static',
vue3+vite创建项目-（傻瓜式教程）
01-19
本教程将指导你如何使用Vue3和Vite创建一个新的项目，让你轻松入门Vue3的世界。 1. 安装Vite 首先，确保你已经安装了Node.js和npm。在命令行中运行以下命令全局安装Vite： ```bash npm install -g create-vite ```...
通过命令行创建vue项目的方法
08-29
这将在本地启动一个热加载的开发服务器，并在浏览器中打开项目。默认情况下，项目会在`http://localhost:8080`上运行。 5. **查看效果**： 在浏览器中输入`http://localhost:8080`，你将看到新创建的Vue项目的...
Vue 基于vite构建vue3项目 以及基础语法演示
最新发布
07-17
Vue 基于vite构建vue3项目 以及基础语法演示Vue 基于vite构建vue3项目 以及基础语法演示Vue 基于vite构建vue3项目 以及基础语法演示Vue 基于vite构建vue3项目 以及基础语法演示Vue 基于vite构建vue3项目 以及基础...
vite+vue3使用模块化批量发布Mockjs接口
03-29
在现代前端开发中，使用Vite和Vue3的组合已经成为了一种高效且灵活的选择。"vite+vue3使用模块化批量发布Mockjs接口"这个主题涵盖了如何在Vite搭建的环境中，结合Vue3和Mockjs来实现接口的模块化和批量处理。这将...
vite-vue3-template:Vite + Vue3项目模板
03-18
Vite + Vue3 项目模板是现代前端开发中的一个高效构建工具，它结合了Vue 3框架的最新特性与Vite的快速开发优势。Vite是由Vue.js的作者尤雨溪开发的一款新型构建工具，旨在解决传统Webpack在开发阶段的性能瓶颈。Vue ...
【Vite的简单配置及使用】
weixin_56612338的博客
11-07 123
Vite的配置及其使用
基于 vite 创建 Vue3 项目，新增的目录文件分析，启动项目
weixin_49931650的博客
01-02 606
基于 vite 创建 Vue3 项目，新增的目录文件分析，最后npm run dev启动项目
vite打包vue，多页面应用和多入口配置
yhl521112的博客
08-23 2950
如果你是像我一样使用electron(或其他的框架)开发多窗口的应用时，这也极大的节省了你打开一些页面的速度，因为对于electron来说每个窗口都是一个独立打开的浏览器标签页面。你需要一个需要独立出来介绍页面，公司简介，其他的页面也需要，这个时候你不必把整个项目都在家，就可以用到这个多页面的应用配置。好了以上就是我配置的多入口以及多页面应用的全部介绍，其实打包的配置还是蛮多的，如果大家想继续深入了解请看下面的链接地址吧。上面介绍了你不必担心下面的配置会给你的项目增加负担，反而减少了你很多困扰。
前端开发新工具-vite
sherlock_l的博客
09-29 2569
vite 是什么 vite——一个由 vue 作者尤雨溪专门为 vue 打造的开发利器，其目的是使 vue 项目的开发更加简单和快速。 vite 究竟有什么作用？用 vite 文档上的介绍，它具有以下特点： 快速的冷启动 即时的热模块更新 真正的按需编译 以上三个优点，社区也早有对应的解决方案，比如快速的冷启动可以借助各种 cli ：vue-cli、create-react-app 等等，热更新就更不用说了，不过按需编译需要开发者自行在代码中使用 impor(‘xx.js’) 实现， 那么 vite 有什
使用vite创建vue2项目
08-18
使用 Vite 创建 Vue 2 项目的步骤如下： 1. 首先，确保你已经全局安装了最新版本的 Node.js。 2. 打开终端，并创建一个新的项目文件夹，进入该文件夹。 3. 在终端中运行以下命令，使用 Vue CLI 创建一个新的 Vue ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值