简单介绍 Vue 3.0 项目创建
一、前期转杯
- 确保电脑上已安装 node.js。
可通过命令npm --version进行查询,如果展示了版本号,则说明已安装,若提示npm 不是有内部或外部命令,也不是可运行的程序,则说明未安装,可进入官网下载并进行安装。 - 确保已安装 Vue CLI。
可通过命令vue --V查看版本号,如果返回了版本号,则说明已安装,若提示vue 不是有内部或外部命令,也不是可运行的程序,则说明未安装Vue CLI, 可使用命令:npm install -g @vue/cli进行安装。
二、创建 vue 项目
在命令行窗口输入命令 vue create [web名称] 后,点击回车(Enter)键。进入如下界面

可以使用方向键上/下进行选项选择,本文只是是基于 vue3 的项目创建,故此处直接点击 回车(Enter)键,此时将进行项目创建。

等待操作完成后,用过 cd 目录路径 ,再输入命令 npm run serve,将出现如下界面,即表示站点已正常运行。

此时在浏览器地址栏中输入 界面上的地址,即可访问 web。如下图:

三、过程中可能存在的问题及解决方案
- 证书过期
问题:安装 Vue CLI 提示证书过期,如下图

解决方案:因淘宝原镜像地址https://registry.npm.taobao.org已过期,现已变更为https://registry.npmmirror.com。可使用命令npm config set registry https://registry.npmmirror.com进行镜像地址更换。 - 包名无效
问题:创建项目时,提示项目名称无效,如下图

解决方案:项目名称不能包含大写字母
简单介绍 Vue 3.0 项目创建的更多相关文章
- vue2.0与vue3.0项目创建
脚手架安装与卸载 安装 npm install -g vue-cli //or npm install -g @vue/cli 卸载 npm uninstall -g vue-cli //or npm ...
- Ionic01 简单介绍、环境搭建、创建项目、项目结构、创建组件、创建页面、子页面跳转
1 Ionic 基本介绍 Ionic 是一款基于 Angular.Cordova 的强大的 HTML5 移动应用开发框架 , 可以快速创建一个跨平台的移动应用.可以快速开发移动 App.移动端 WEB ...
- VUE 安装及项目创建
Vue.js 安装cnpm npm install -g 镜像 cnpm --registry=https://registry.npm.taobao.org 安装 vue.js cnpm insta ...
- springboot学习入门简易版二---springboot2.0项目创建
2 springboot项目创建(5) 环境要求:jdk1.8+ 项目结构: 2.1创建maven工程 Group id :com.springbootdemo Artifact id: spring ...
- cocos2dx3.0项目创建流程
cocos2dx3.0不是beta,新增了wp项目创建的支持 但不知道为啥非beta版本号的tools文件夹中取消了project-creator,可能有更改吧 没有这个工具还挺麻烦.就自己手动创建c ...
- VUE安装环境及项目创建
Vue环境安装配置 安装git工具,便于在wind电脑上操作命令行,自行在网上下载安装,(可以不安装)使用cmd. 安装node,检查node安装是否成功,在git工具中输入node -v(如果成功的 ...
- C#中Fun简单介绍及运用到项目中与缓存(本地缓存,Redis)结合使用
1.简单介绍Fun C#中Fun和Action有点类似,都是一个委托方法,不同的是Func是有返回值的,而Action没有. (T)此委托封装的方法的参数类型. 备注:详情了解Fun到(https: ...
- 简单介绍一下vue2.0
Vue Vue是用于构建用户界面的渐进框架.作者尤雨熙特别强调它与其他的框架不同,Vue是渐进式的框架,可以逐步采用,不必一下就通过框架去重构项目. 另外Vue的核心库只专注于视图层,这样就更容易与其 ...
- vue2.0项目创建之环境变量配置
安装node 传送门 <node安装步骤>关于环境的配置,百度一大把 安装淘宝镜像 npm install -g cnpm --registry=https://registry.npm. ...
- ubuntu下code::blocks编译运行一个简单的gtk+2.0项目
在具体的操作之前,首先需要安装一些必要的软件.ubuntu下默认安装了gcc,不过缺少必要的Header file,可以在命令行中输入下面的指令安装build-essential套件:sudo apt ...
随机推荐
- AOP+自定义注解实现权限校验-2022新项目
一.业务场景 当前本人参与开发的是一个业务中台系统,所谓的中台简单的理解就是把相同的功能给抽取出来.比如系统A.B.C.D都需要进行用户登录操作,那么可以把用户信息管理这一块抽取出来为一个独立的系统E ...
- 来自 AI Secure 实验室的 LLM 安全排行榜简介
近来,LLM 已深入人心,大有燎原之势.但在我们将其应用于千行百业之前,理解其在不同场景下的安全性和潜在风险显得尤为重要.为此,美国白宫发布了关于安全.可靠.可信的人工智能的行政命令; 欧盟人工智能法 ...
- Redis 八种常用数据类型详解
夯实基础,这篇文章带着大家回顾一下 Redis 中的 8 种常用数据类型: 5 种基础数据类型:String(字符串).List(列表).Set(集合).Hash(散列).Zset(有序集合). 3 ...
- [【stars-one】Android图标生成器 PC工具
原文: [stars-one]Android图标生成器 - Stars-One的杂货小窝 一款Android开发者的PC工具软件,可以快速生成android开发需要使用的xml矢量图标文件 起因 个人 ...
- 快速排序——Java
快排的思想想必大家都懂,前后两个指针,向中间靠拢.我这个partition函数能保证所有相同的数都被比较一次,靠拢在一起. 代码: public class Main { public static ...
- Activity系列博客5篇
目录介绍 01.前沿介绍 02.handleLaunchActivity 03.performLaunchActivity 04.activity.attach 05.Activity的onCreat ...
- 记录--前端项目中运行 npm run xxx 的时候发生了什么?
这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 npm 是 node 捆绑的依赖管理器,常用程度可想而知.那么你每天都在 npm/yarn run 的命令到底是如何运行项目的呢? 前端项 ...
- linux安装crontab
1.查看是否安装 rpm -qa | grep cron #没有输出内容说明没有安装 2.安装 yum -y install vixie-cron #cron 的主程序 yum -y install ...
- Ant Design Vue Tree 选中子节点同时半选中父级节点
需要实现的效果: 1.子菜单如果不是全部选中,一级菜单半选. 2.子菜单全选,一级菜单选中. 3.一级菜单选择,二级菜单全选. 4.没有二级菜单,则只控制一级菜单. 主要用到的属性是checked和h ...
- #01背包#洛谷 2340 [USACO03FALL]Cow Exhibition G
题目 有\(n\)个物品,对于第\(i\)个物品, 有两种属性,第一种属性为\(x_i\),第二种属性为\(y_i\) 问选择若干个物品使得\(\sum{x_j}\geq 0\)且\(\sum{y_j ...