首页 > 其他分享 >使用create-vue创建vue3项目

使用create-vue创建vue3项目

时间:2023-08-12 15:26:29浏览次数:43  
标签:npm vue 项目 创建 create vue3

create-vue是vue3新的脚手架搭建项目工具,底层构建工具使用vite,而不是vue-cli的webpack。

但不是说你不能用以前的vue create命令来创建vue3项目,你完全可以用vue-cli来创建。

vite:https://cn.vitejs.dev/guide/#scaffolding-your-first-vite-project

使用create-vue创建项目

使用create-vue前提:node js版本建议大于16.0(查看版本命令:node -v

执行命令,该命令会安装create-vue,并开始创建vue3项目

npm init vue@latest

创建完之后会提示你继续执行几条命令,如上图。

# cd到项目根目录
cd vue3-demo
# 安装全部项目依赖(依赖是在package.json中定义的)
npm install 
# 运行项目
npm run dev

标签:npm,vue,项目,创建,create,vue3
From: https://www.cnblogs.com/juelian/p/17624837.html

相关文章

  • create-vue和vue-cli创建项目的差异
    这里对比的是vue-cli和create-vue创建vue3项目的文件中的内容差异。原来public中的index.html被移动到根目录:(原因见这里:)https://cn.vitejs.dev/guide/#index-html-and-project-root<!--不同点1:script放在了最前面,方便编写代码,实际上你给他放在最后面也没问题.script属......
  • vue3组合式api生命周期
    生命周期钩子函数Vue3:https://cn.vuejs.org/api/composition-api-lifecycle.htmlVue2:https://v2.cn.vuejs.org/v2/api/#选项-生命周期钩子Vue2(选项式)Vue3(选项式)Vue3(组合式Api)beforeCreate()beforeCreate()created()created()setup()beforeMount()bef......
  • vue3在父子组件使用v-model双向绑定
    父组件:<scriptsetup>importInputBoxfrom"@/compon/InputBox.vue";import{ref}from"vue";constcount=ref(100)</script><template><div>我是父组件,{{count}}<InputBoxv-model="count"&......
  • vue3.3实验性新特性defineModel
    子父之间使用v-model双向绑定数据,子组件每次都要写emit和props觉得麻烦?vue3.3新的实验性特性defineModel可以完全不写emit和props。由于是实验性特性,所以需要配置之后才能使用。修改vite.config.js:exportdefaultdefineConfig({plugins:[vue(**{script:{......
  • VUE
    Vue是构建用户界面的渐进式JavaScript框架尤雨溪开发的特点:1.采用组件化模式,提供代码复用性、且让代码更好维护2.声明式编码,让编码人员无需直接操作DOM,提高开发效率。3.使用虚拟DOM+优秀的Diff算法,尽量复用DOM节点。 ......
  • VUE使用模板页面并预留子页面区域
    1.新建模板页面MainLayout.vue,并在template里面防止标签用于嵌入子页面内容<template>'''其他页面内容'''<router-view></router-view>'''其他页面内容'''</template>2.在router的index.js中设置子路由,其中DailyData......
  • HTML 全屏水印 vue 全屏水印
    HTML全屏水印vue全屏水印<!DOCTYPEhtml><html><head><metacharset="utf-8"><title>水印</title><style>#water-div{pointer-events:none;position:fixed;top:0;left:0;right:0;bottom:0;}......
  • Vue中实现矩形和虚线的分离
    要在Vue中实现矩形和虚线的分离,你可以使用Vue的模板语法和样式绑定来实现。下面是一个示例代码,展示了如何使用Vue实现一个具有矩形和虚线的分离效果:<!DOCTYPEhtml><html><head><title>矩形和虚线分离</title><style>.rectangle{width:200px;......
  • Vue 路由懒加载
    1路由懒加载的原理路由懒加载是一种优化技术,用于延迟加载应用程序中的路由组件。它可以提高初始加载速度并减少资源消耗,特别适用于大型单页应用。1.1为什么要使用路由懒加载当应用程序包含多个页面和路由时,如果在初始加载时将所有路由组件都打包到一个文件中,会导致初始加载时......
  • antd vue 解决a-select下拉菜单跟随页面滚动
    问题描述:antd a-select下拉菜单会跟着滚动一块走 官方原话:getPopupContainer菜单渲染父节点。默认渲染到body上,如果你遇到菜单滚动定位问题,试试修改为滚动的区域,并相对其定位  解决方案:这样就ok了 :getPopupContainer="triggerNode=>triggerNode.parentNode"......