当前位置: 首页 > news >正文

Vue3.0极速入门 - 环境安装新建项目

Vue介绍

Vue.js 是什么

Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。

说明

官方指南假设你已了解关于 HTML、CSS 和 JavaScript 的中级知识。如果你刚开始学习前端开发,将框架作为你的第一步可能不是最好的主意——掌握好基础知识再来吧!之前有其它框架的使用经验会有帮助,但这不是必需的。

环境安装

npm安装:

1、下载nodejs:Download | Node.js

2、双击下载包进行安装

3、安装好之后在终端输入命令:npm -v,正确返回版本信息就安装好了

cnpm安装:

如果npm换了国内镜像还是很慢,可以使用cnpm,属于npm在国内的镜像工具
安装:

npm install -g cnpm --registry=https://registry.npm.taobao.org

验证

cnpm -v

Vue安装:

vue:
npm install vue@next
vue-cli:
npm install -g @vue/cli
vue-init: (可选装,构建2.x版本的vue才需要)
npm i -g @vue/cli-init

webpack安装

npm install webpack -g

新建vue项目

命令行构建helloworld

新建文件夹helloworld,命令行cd到helloworld目录下
vue create hello-world
需要填写一部分信息:

新建完成

验证

cd到hello-world目录,执行

npm run serve

运行成功结果

在浏览器输入http://localhost:8080
截图

恭喜完成项目搭建。

vue2.x与vue3.x新建项目的区别

版本构建命令运行项目
vue2.xvue init webpack 项目名称npm run dev
vue3.xvue create 项目名称npm run serve
http://www.lryc.cn/news/141105.html

相关文章:

  • android 使用libyuv 图像转换
  • 奥比中光:进击具身智能,打造机器人之眼
  • 微信小程序报错: SyntaxError: Cannot use import statement outside a module
  • Ruoyi微服务启动流程
  • Android scrollTo、scrollBy、以及scroller详解 自定义ViewPager
  • Aidex 移动端快速开发框架# RuoYi-Uniapp项目,uniapp vue app项目跨域问题
  • JVM7:垃圾回收是什么?从运行时数据区看垃圾回收到底回收哪块区域?垃圾回收如何去回收?垃圾回收策略,引用计数算法及循环引用问题,可达性分析算法
  • NFT Insider #104:The Sandbox:全新土地销售活动 Turkishverse 来袭
  • Docker架构及原理
  • VScode使用SSH连接linux
  • 多线程的创建与同步
  • LLMs 缩放指令模型Scaling instruct models FLAN(Fine-tuned LAnguage Net,微调语言网络)
  • 政务大厅人员睡岗离岗玩手机识别算法
  • 认识Mybatis的关联关系映射,灵活关联表对象之间的关系
  • 如何开发一款唯一艺术平台 区块链 /数字藏品
  • 【UniApp开发小程序】私聊功能后端实现 (买家、卖家 沟通商品信息)【后端基于若依管理系统开发】
  • 运维高级学习--Kubernetes(K8s 1.28.x)部署
  • Apache zookeeper kafka 开启SASL安全认证 —— 筑梦之路
  • lintcode 1017 · 相似的RGB颜色【进制计算】
  • 全国首台!浙江机器人产业集团发布垂起固定翼无人机-机器人自动换电机巢
  • 采用 UML 对软件系统进行建模的基本框架
  • 编译tiny4412 Linux 内核
  • Ubuntu22.04安装中文输入法►由踩坑到上岸版◄
  • SpringBoot简单上手
  • git及GitHub的使用
  • 【考研数学】线性代数第四章 —— 线性方程组(1,基本概念 | 基本定理 | 解的结构)
  • 使用Python写入数据到Excel:实战指南
  • 接口测试总结分享(http与rpc)
  • 数据结构(Java实现)LinkedList与链表(下)
  • linux查看正在运行的nginx在哪个文件夹当中