首页 > 其他分享 >yarn + vue3 + vite 创建项目

yarn + vue3 + vite 创建项目

时间:2024-04-30 11:22:48浏览次数:30  
标签:创建 yarn 选择 vite vue3 回车

 

 

yarn create vite  // 通过yarn+vite创建项目

填写的创建的项目名称, 默认名称 vite-project

 选择框架,我们点击上下键,回车选择,我们这里选择vue

 选择语言,我们点击上下键,回车选择,我们这里选择TypeScript,即ts,然后回车

 创建成功,如下

 按照提示,执行命令

cd vite-project  //进入刚刚创建的项目
 yarn // yarn 命令,安装所需库
 yarn dev //运行

运行

 查看http://localhost:5173/地址

 

标签:创建,yarn,选择,vite,vue3,回车
From: https://www.cnblogs.com/s42-/p/18167659

相关文章

  • Vue3+Ts i18n实现国际化
    1、下载依赖npminstallvue-i18n@nex2、在src目录下创建文件夹创建文件index.ts、zh/index.ts、en/index.ts //index.tsimport{createI18n}from'vue-i18n'importzhfrom'./zh/index'importenfrom'./en/index'constmessages={en,zh,}......
  • 在vue2中,什么是双向绑定,为什么vue3要进行优化?
    一、什么是双向绑定我们先从单向绑定切入单向绑定非常简单,就是把Model绑定到View,当我们用JavaScript代码更新Model时,View就会自动更新双向绑定就很容易联想到了,在单向绑定的基础上,用户更新了View,Model的数据也自动被更新了,这种情况就是双向绑定举个栗子 当用户填写表单时,View......
  • vue3中ctrl加回车换行,光标位置设置
    <input v-model="text" type="textarea"@click="sbwz"@keydown="keysbwz" @keydown.enter.ctrl.exact.prevent="ctrlEnter" /> //暂存光标位置,后续截取换行使用consttextSplit=ref(0)//判断是否改变了上次光标位置constisTest=r......
  • vue3 把quill的base64变成图片地址
      你可以看看https://www.kancloud.cn/liuwave/quill/1434141或者看看别人的文章我的项目是vu3的 template的是这样的<el-form-itemlabel="中文详情"prop="content"><div><quill-editorref="QuillEditor"v-model:content="form.......
  • Vue3中SEO优化实践:利用unhead vue插件设置Mate标签
    我们在构建Vue3项目时,搜索引擎优化(SEO)是一个不可忽视的重要方面。优化网站结构、内容和代码,使其更符合搜索引擎的排名规则,对于提升网站曝光度和吸引更多用户至关重要。其中,设置合适的Mate标签(如标题、描述和关键词)是SEO优化的关键步骤之一。在Vue3项目中,我们可以利用unhead插件来......
  • uniapp+vue3聊天室|uni-app+vite4+uv-ui跨端仿微信app聊天语音/朋友圈
    原创研发uniapp+vue3+pinia2跨三端仿微信app聊天模板Uniapp-Wechat。uni-vue3-wchat基于uni-app+vue3+pinia2+uni-ui+uv-ui等技术跨端仿制微信App界面聊天项目,支持编译到H5+小程序端+App端。实现编辑框多行消息/emoj混合、长按触摸式仿微信语音面板、图片/视频预览、红包/朋友圈......
  • vite 项目,背景图报错 The request url "xx/xx/xx.xx" is outside of Vite serving all
    版本vite3.2.6vue3.2.37 背景本地启项目,项目中引用了自研组件库(没有安装,通过文件路径直接引用,便于调试项目和组件),两者文件夹是平级的组件库中背景图:background:100%/100%no-repeaturl('../assets/svg/xxx.svg'); 问题本地启动项目之后,背景图未正常展示浏览器控......
  • vue3项目打包的时候报错'openBlock' is not exported by node_modules/...
    用了一个手写签名的,开发环境中一切正常,但是在打包发布的时候,就报错了。'openBlock'isnotexportedbynode_modules/vue-esign/node_modules/vue/dist/vue.runtime.esm.js.... 这个应该是vue版本重复导致的。 解决:在vite.config.ts中加入 dedupe:['vue'],  dedupe是......
  • vue3 引入workers 大量优化业务代码和复杂的计算的代码
    前沿vite页面引入worker在src新建一个 worker.d.ts文件declaremodule'*.worker.ts'{classWebpackWorkerextendsWorker{constructor();}exportdefaultWebpackWorker;}在 tsconfig.json页面引入"lib":["esnext",......
  • 响应式原理(Vue3、Vue2)
    1.Vue3副作用函数(onMounted、watchEffect)帮助管理组件中的副作用逻辑,并自动追踪其依赖关系,以确保在数据变化时能够自动触发副作用函数的更新。会自动追踪被其内部函数引用的响应式数据。当这些数据发生变化时,Vue3会自动重新运行副作用函数,确保副作用与数据的状态保持同步。......