当前位置: 首页 > Web前端 > vue.js

快速入门Vue3

时间:2023-03-31 22:25:59 vue.js

1。认识Vue31)了解相关信息Vue.js3.0《海贼王》正式版于今年9月发布。2年多的开发,100+贡献者,2600+投稿,600+PRVue3支持vue2的大部分特性更好的支持Typescript2)性能提升:包体积减少41%,初始渲染速度提升55%,更新渲染速度提升133%,54%内存减少使用Proxy代替defineProperty实现数据响应重写VirtualDOM实现和Tree-Shaking3)新特性Composition(组合)APIsetupref和reactivecomputedandwatch新生命周期函数提供和注入...新组件Fragment-文档片段Teleport-teleport组件位置悬念-异步加载组件加载接口其他API更新全局API的修改将原来的全局API转移到应用对象模板语法变化2.创建一个vue3项目1)使用vue-cli创建安装或升级npminstall-g@vue/cli确保vuecli版本在4.5.0以上vue--version创建项目vuecreatemy-project然后请pickapreset-选择Manuallyselectfeatures勾选你的项目需要的features-选择TypeScript,特别注意空格是选择,回车是下一步选择Vue.js的版本你想用它开始项目-选择3.x(预览版)使用类风格的组件语法-直接输入使用Babel和TypeScript-直接输入选择一个linter/格式化程序配置-直接输入路由器使用历史模式?-直接输入Pickalinter/formatterconfig-直接输入Pickadditionallintfeatures-直接输入你更喜欢在哪里放置Babel、ESLint等的配置?-直接输入将其保存为未来项目的预设?-直接回车2)使用vite创建vite是一个原生的ESM驱动的Web开发构建工具,是在开发环境中基于浏览器原生ES导入开发的。实现本地快速开发启动,生产环境基于Rollup打包。快速冷启动,无需等待包装作业;模块即时热更新,更换性能与模块数量解耦,让更新飞起来;真正的按需编译,不再等待整个应用编译完成,这是一个巨大的变化。npminitvite-appcdnpminstallnpmrundev