Vue的安装与启动

news2024/11/18 12:47:33

工程化

通过vue脚手架创建vue项目

1.全局安装脚手架

npm install @vue/cli -g

注:如果网络太慢,则优先安装淘宝镜像

npm install -g cnpm --registry=https://registry.npmmirror.com

安装好后

cnpm -v 查看淘宝镜像的版本

之后通过淘宝镜像安装脚手架

cnpm install @vue/cli -g

vue -V 查看脚手架版本

2.使用脚手架创建vue工程

2.1手动进入想要保存的项目的位置,在这个位置打开命令行

2.2创建项目 vue create 项目名

创建项目会有不同的依赖文件,也会预先安装不同的插件。这一步的前两个选项,是脚手架提供的默认选项。

选择最后一个手动安装后回车

按图选择以下三个选项

注:前期的学习中Linter必须勾选掉

选择vue的版本,前期从2.x开始入手

如果手动选择时,选择了Router插件,则会有这一步

选择Router的模式:

Y:history模式        n:hash模式

注:两个模式没有好坏之分,选择哪个都可以

注:Y大写代表Y时默认选项。如果这一步没有输入直接回车,则默认输入Y

如何创建配置文件?选择第二个package.json

是否把以上选项保存为默认选项?

y:保存        N:不保存

注:N大写代表N是默认选项,直接回车则直接输入N

回车开始创建项目

创建成功

3.启动项目

3.1进入到项目中

手动进入,在项目内部打开命令行

3.2启动项目 npm run serve

项目启动成功

3.3 在浏览器中,输入以上两个地址中的任意一个,可以访问项目

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1550143.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Spring实战:采用Spring配置文件管理Bean

文章目录 一、Spring框架概述二、实战:采用Spring配置文件管理Bean(一)创建Jakarta EE项目(二)添加Spring依赖(三)创建杀龙任务类(四)创建勇敢骑士类(五&…

显示器接口的了解

显示器视频接口科普:看完就懂HDMI、DP、DVI、VGA、USB-C哪个更适合你的电脑外接显示器_哔哩哔哩_bilibili 电脑显示接口: VGA,DVI,HDMI,DP,USB-C VGA:基本被淘汰了。 常见的还是HDMI1.4和2.0规格 更适合电脑使用的DP接口(免费)…

开源AI引擎|企业合同管理:自然语言处理与OCR技术深度融合

一、企业应用:合同智能管理 结合NLP和OCR技术,企业可以构建智能化的合同管理系统,实现合同的自动化审查、风险评估和知识抽取。这样的系统不仅能够提高合同处理的效率,还能够降低人为错误,加强风险控制。 例如&#x…

蓝桥杯-网络安全比赛(2)基础学习-正则表达式匹配电话号码、HTTP网址、IP地址、密码校验

正则表达式(Regular Expression):定义:一种强大的文本处理工具,用于描述、匹配和查找字符串中的特定模式。应用:密码验证、文本搜索和替换、数据清洗等。特点:通过特定的元字符和规则来构建复杂…

07_Response

文章目录 案例(请求分发案例) Response响应行响应头响应体特殊响应头refreshContent-typeContent-dispositionlocation 案例(登录案例) 案例(请求分发案例) 场景:有多个请求 Http://localhost:…

【检索稳定|火爆征稿中】2024年企业管理与数字化经济国际学术会议(ICBMDE 2024)

【检索稳定|火爆征稿中】2024年企业管理与数字化经济国际学术会议(ICBMDE 2024) 2024 International Conference on Business Management and Digital Economy(ICBMDE 2024) ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~…

6_相机坐标系_相机4个坐标系详述

相机系列文章是用来记录使用opencv3来完成单目相机和6轴机械臂手眼标定。本人吃饭的主职是linux下6轴机械臂相关应用开发。但对于机械臂运动学、相机应用等都非常感兴趣,所以对一些线性代数基础薄弱又想深入了解机械臂内部运算的同志比较有体会。由于是探索性学习&a…

基于Spring Boot的在线学习系统的设计与实现

基于Spring Boot的在线学习系统的设计与实现 摘 要 在线学习系统是以大学传统线下教学方式不适应信息技术的迅速发展为背景,提高学习效率,解决传统教学问题,并且高效的实现教学信息化的一款软件系统。为了更好的实现对于教学和学生的管理&a…

Dockerfile:自定义镜像

Dockerfile 是一个文本文件,其中包含了一系列用于自动化构建Docker镜像的指令。通过编写Dockerfile,开发者能够明确地定义一个软件应用及其运行环境应该如何被封装进一个可移植、可重复构建的Docker镜像中。 第一步:在/tmp文件下新建docker…

使用itext-core生成PDF

1、添加引用依赖包 <dependency><groupId>com.itextpdf</groupId><artifactId>itext-core</artifactId><version>8.0.3</version><type>pom</type></dependency> 2、上代码 package com.student.demo.pdf;impor…

CUDA版本支持的pytorch版本

PyTorch 1.0.x - 支持 CUDA 7.5 PyTorch 1.1.x - 支持 CUDA 8.0 PyTorch 1.2.x - 支持 CUDA 9.0 PyTorch 1.3.x - 支持 CUDA 9.2 PyTorch 1.4.x - 支持 CUDA 10.1 PyTorch 1.5.x - 支持 CUDA 10.2 PyTorch 1.6.x - 支持 CUDA 11.0 PyTorch 1.7.x - 支持 CUDA 11.0/11.1 PyTorch…

数字身份的革命:解锁 Web3 的身份验证技术

引言 随着数字化时代的到来&#xff0c;个人身份认证成为了日常生活和商业活动中不可或缺的一部分。传统的身份验证方式存在着安全性低、易伪造、不便利等问题&#xff0c;因此&#xff0c;人们迫切需要一种更安全、更便捷的身份验证技术。在这样的背景下&#xff0c;Web3的身…

【C语言】Infiniband驱动init_dev_assign函数

一、注释 一个内核模块的初始化函数&#xff0c;用于分配和初始化某些资源。以下是对代码块的逐行中文注释&#xff1a; // 定义一个初始化设备分配的函数 static void init_dev_assign(void) {int i 1;spin_lock_init(&dev_num_str_lock); // 初始化自旋锁if (mlx4_fil…

超级会员卡积分收银系统源码:积分+收银+商城三合一小程序 带完整的安装代码包以及搭建教程

信息技术的迅猛发展&#xff0c;移动支付和线上购物已经成为现代人生活的常态。在这样的背景下&#xff0c;商家对于能够整合收银、积分管理和在线商城的综合性系统的需求日益强烈。下面&#xff0c;罗峰给大家分享一款超级会员卡积分收银系统源码&#xff0c;它集积分、收银、…

pyecharts操作一

pyecharts 是一个用于生成Echarts图表的Python库。Echarts是百度开源的一个数据可视化JS库&#xff0c;可以生成一些非常酷炫的图表。 环境安装 pip install pyecharts 检查版本 import pyecharts print(pyecharts.version) 2.0.3 柱状图绘制 from pyecharts.charts impor…

通过Jmeter准备压测数据-mysql示例

1、新建线程组 总共30万条数据 2、创建jdbc链接 创建jdbc连接配置 配置mysql连接 需要在jmeter安装的路径\apache-jmeter-5.6.3\lib\ext 目录下添加mysql 驱动 3、创建jdbc请求 jdbc链接名称需要与上一步中的保持一致&#xff0c;同时添加insert语句 例如 INSERT INTO test…

【tingsboard开源平台】下载数据库,IDEA编译,项目登录

一&#xff0c; PostgreSQL 下载 需要看官网的&#xff1a;点此下载直达地址&#xff1a;点此进行相关学习&#xff1a;PostgreSQL 菜鸟教程 二&#xff0c;PostgreSQL 安装 点击安装包进行安装 出现乱码错误&#xff1a; There has been an error. Error running C:\Wind…

macos下 jupyter服务安装和vscode链接密码设置 .ipynb文件

最近收到了一些后缀为.ipynb的文件&#xff0c; 这个文件就是使用jupyter编辑的&#xff0c;于是就需要安装一个jupyter服务&#xff0c; 对于最新版本的jupyter 网上很多的资料都已经过期了&#xff0c;这里以最新版本的jupyter为例。 jupyter lab安装 jupyter 这个工具包含…

HBase的Python API操作(happybase)

一、Windows下安装Python库&#xff1a;happyhbase pip install happybase -i https://pypi.tuna.tsinghua.edu.cn/simple 二、 开启HBase的Thrift服务 想要使用Python API连接HBase&#xff0c;需要开启HBase的Thrift服务。所以&#xff0c;在Linux服务器上&#xff0c;执行…

Adobe推出20多个,企业版生成式AI定制、微调服务

3月27日&#xff0c;全球多媒体领导者Adobe在拉斯维加斯召开“Summit 2024”大会&#xff0c;重磅推出了Firefly Services。 Firefly Services提供了20 多个生成式AI和创意API服务&#xff0c;支持企业自有数据对模型进行定制、微调&#xff0c;同时可以与PS、Illustrator、Ex…