初识Vue

Vue (发音为 /vju:/,类似 view)是一款用于构建用户界面的JavaScript 框架。它基于标准 HTML、CSS 和JavaScript 构建,并提供了一套声明式的、组件化的编程模型,帮助你高效地开发用户界面。无论是简单还是复杂的界面,Vue 都可以胜任。

Vue 是一个框架,也是一个生态。其功能覆盖了大部分前端开发常见的需求。但 Web 世界是十分多样化的,不同的开发者在 Web 上构建的东西可能在形式和规模上会有很大的不同。考虑到这一点,Vue 的设计非常注重灵活性和"可以被逐步集成"这个特点。

vue 开发准备

构建工具让我们能使用 Vue 单文件组件 (SFC)。Vue 官方的构建流程是基于 Vite 的,一个现代、轻量、极速的构建工具 。

1.创建项目

利用快捷键 win+R 输入cmd 进入命令行

在命令行中输入:npm init vue@latest 来创建项目(要求node.js版本大于15.0)

复制代码
npm init vue@latest

在命令行输入后会出现创建项目名称提示

在"请输入项目名称:"后输入你的项目名称(以vue-***的格式书写,不能有大写字母)。

输入项目名称后会出现提示是否开启某个功能,初期可以全部点否。

提示全部点击完了后,需要在创建的vue项目文件下输入npm inatall 来下载项目

复制代码
npm install

下载成功后,可以输入npm run dev来运行项目。

复制代码
npm run dev

运行成功后会出现以下信息

可以在浏览器上粘贴Local后面的值来访问运行页面。

注意:如果是利用VScode 开发的话需要下载名叫Vue - Official 的插件

相关推荐
IT_陈寒19 小时前
SpringBoot 项目启动慢?这5个优化技巧让你的应用快50%
前端·人工智能·后端
GISer_Jing20 小时前
React核心语法:组件化与声明式编程
前端·react.js·前端框架
DJ斯特拉20 小时前
文件上传(UUID防止重名文件&&阿里云实现云端上传&&MultipartFile接收前端文件)
前端
Alan Lu Pop20 小时前
React 表单提交关键词意外触发刷新
前端·javascript·react.js
掘金安东尼20 小时前
企业级Claw落地避坑指南:70%项目失败的真实原因
前端·面试·github
这儿有一堆花20 小时前
从技术标准到营销概念:深度解析 HTML5 与 H5 的演变与区别
前端·html·html5
我命由我1234520 小时前
React - 创建 React 项目、React 项目结构、React 简单案例、TodoList 案例
前端·javascript·react.js·前端框架·ecmascript·html5·js
SuperEugene20 小时前
Vue3 Pinia 状态管理规范:何时用 Pinia 何时用本地状态|状态管理与路由规范篇
开发语言·前端·javascript·vue.js·前端框架
Moment20 小时前
TypeScript 要换芯了,6.0 竟是旧编译器的最后一舞
前端·javascript·github
Cg1362691597420 小时前
Element-入门
前端