首页 > 其他分享 >Vue3| create-vue 脚手架工具

Vue3| create-vue 脚手架工具

时间:2023-10-13 17:27:13浏览次数:37  
标签:npm vue create Vue Vue3 工具 脚手架

create-vue 是 Vue 官方新的脚手架工具,底层切换到了 vite(下一代构建工具),为开发提供极速响应

 

使用 create-vue 创建项目:

1. 前提环境条件:

   已安装 16.0 或更高版本的 Node.js(node -v)

2. 创建一个 Vue 应用:npm init vue @latest(这一指令将会安装并执行 create-vue)

启动项目:

cd vue3-learn01
npm install
npm run dev

 

标签:npm,vue,create,Vue,Vue3,工具,脚手架
From: https://www.cnblogs.com/gagaya2/p/17762586.html

相关文章

  • 【前端开发】前端开发都应该知道的vueuse
    前言:我们在写项目业务时进场会要封装一些工具函数,经常会遇到重复造轮子现象,这里给大家普及下vueuse,是基于Vue组合式API的实用工具集。比如如下简单的几个例子:useDateFormat   时间格式处理函数useTimeAgo     几小时/上周前等处理函数 useMouse     ......
  • 【前端开发】vue3+vite项目部分优化
    1、使用rollup-plugin-visualizer可视化分析包npmirollup-plugin-visualizer-S在vite.config.js中引入 在plugins里面 然后执行npmrunbuild就自动打开可视化分析2、CDN加速在vite.config.js中引入import{autoComplete,PluginasimportToCDN}from"v......
  • vue实例挂载以及模板解析过程
    抽空看了下vue源码,记录下newVue()的过程。 在package.json中运行命令添加sourcemap,打包后在源码案例目录下创建新的html文件,运行后可以在控制台断点调试 测试代码<scriptsrc="../../dist/vue.js"></script><divid="demo"><p@click="searchQuery=333">{{sear......
  • 通过 modules 创建 vuex 的模块
    模块拆分:1.在store文件夹下再新建文件夹modules,在modules下新建xxx.js文件:eg:新建user.js文件conststate={ userInfo:{  name:'zs',  age:18 }, score:80}constmutations={}constactions={}constgetters={}exportdefault......
  • 使用vue在移动端显示树状多选功能
    最近的项目要求是做一个树状的多选功能,然而该项目是使用vant4作为前端的框架,vant4只有树状单选,没有多选的,那只能自己写一个了。借鉴博主https://blog.csdn.net/m0_68428581/article/details/130641982,我将他的代码转成了vue3的语法,并且根据自己的项目需求进了相关改动,终于实现......
  • 在vue中使用XLSX库实现Excel的导入导出
    XLSX库是个十分强大的利用前端js处理excel文档的库,官网:https://www.sheetjs.com/vue中安装即使用:安装pnpminstallxlsxpnpminstallxlsx-style-hzx//设置边框与格式用 使用<div@click="exportExcel"style="width:40px;height:40px;position:absolute;z-index......
  • Vue学习笔记(十):全局事件总线
      之前博客中介绍了prop和调用事件的方式在父-子组件之间进行数据,这种方式在只有一层嵌套层时可以使用,但是路过存在多层嵌套,多层多个“兄弟”组件之间传递数据,就非常麻烦。对此,vue中提供了一种全局事件总线机制,数据传递是通过一个空的Vue实例作为中央事件总线,通过它......
  • vue - alias
    3.别名alias配置:build\webpack.base.conf.js:module.exports={...,resolve:{extensions:['.js','.vue','.json'],alias:{'@':resolve('src'),'common':resolve('src......
  • vue el-select/el-cascader获取选中的对象label值
    1.el-select获取选中对象label值<el-form-itemlabel="车辆配置"prop="sales_name"><el-selectv-if="!showSaleNameInput"v-model="form.sales_name"clearableref="itemSelect"......
  • 2. Vue简介
    三大问题(是什么,为什么,怎么办):Vue是帮助前端优化开发的一个工具,是一个框架渐进式框架的概念Vue2-->Vue3......