VUE从0到1创建项目及基本路由、页面配置

一、创建项目:(前提已经安装好vue和npm)

目录:E:\personal\project_pro\

windows下,win+R 输入cmd进入命令行:

cd E:\personal\project_pro
E:# 创建名为test的项目
vue create test# 用上下键选择vue2或vue3,回车确认创建

本次选择VUE3        

创建好项目后,使用pycharm或者其他编译器打开,结构目录如下,除红色框内外其他内容默认创建

二、新增vue页面

在components文件夹下新建两个vue文件做测试用:aaa.vue、bbb.vue

vue中内容如下:

# aaa.vue
<template>
<div>这是aaa</div>
</template><script>
export default

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

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

相关文章

Nginx之rewrite重写功能

一、rewrite概述 1、rewrite功能 访问重写 rewrite 是 Nginx HTTP 请求处理过程中的一个重要功能&#xff0c;它是以模块的形式存在于代码中的&#xff0c;其功能是对用户请求的 URI 进行 PCRE 正则重写&#xff0c;然后返回 30 重定向跳转或按条件执行相关配置。 Nginx服务…

idea 创建打包 android App

1、使用 idea 创建 android 工程 2、 配置构建 sdk 3、配置 gradle a、进入 gradle 官网&#xff0c;选择 install &#xff08;默认是最新版本&#xff09; b、选择包管理安装&#xff0c;手动安装选择下面一个即可 c、安装 sdk 并通过 sdk 安装 gradle 安装 sdk&#xff1a…

软件无线电SDR加人工智能算法实现无人机频谱探测

通用软件无线电接收机作为传感器实时接收探测无线电信号&#xff0c;加上深度学习算法实现频谱识别&#xff0c;(https://img-blog.csdnimg.cn/5a6c4d89a047453a94f763f4e67aeb17.png)

合并果子(哈夫曼树)NOIP2004提高组

在一个果园里&#xff0c;达达已经将所有的果子打了下来&#xff0c;而且按果子的不同种类分成了不同的堆。 达达决定把所有的果子合成一堆。 每一次合并&#xff0c;达达可以把两堆果子合并到一起&#xff0c;消耗的体力等于两堆果子的重量之和。 可以看出&#xff0c;所有…

大话设计模式——3.建造者模式(Builder Pattern)

1.定义&#xff1a; 将一个复杂对象的构建与它的表示分离&#xff0c;使得同样的构建过程可以创建不同的表示。UML图 2.示例&#xff1a; 汽车或者电脑的组装可以采用构造者模式进行设计&#xff0c;如汽车的引擎或者轮胎&#xff0c;电脑的处理器、内存、主板等都可以进行…

flutter简单的MethodChannel通道Demo(引入调用小红书sdk)

flutter端创建MethodChannel类 import package:flutter/services.dart;//MethodChannel const methodChannel const MethodChannel(com.flutter.demo.MethodChannel);class FlutterMethodChannel {/** MethodChannel flutter给原生发信息* 在方法通道上调用方法invokeMethod*…

[开源协议] 什么是MIT协议及其使用场景

什么是MIT协议? MIT协议是一种开放源代码软件授权协议&#xff0c;全称为Massachusetts Institute of Technology License。该协议允许自由地使用、复制、修改、合并、发布、分发、再授权和销售软件及其副本的任何部分。MIT协议要求在软件的所有副本中包含版权声明和许可声明…

高性能API云原生网关 APISIX安装与配置指南

Apache APISIX是Apache软件基金会下的顶级项目&#xff0c;由API7.ai开发并捐赠。它是一个高性能的云原生API网关&#xff0c;具有动态、实时等特点。 APISIX网关可作为所有业务的流量入口&#xff0c;为用户提供了丰富的功能&#xff0c;包括动态路由、动态上游、动态证书、A…

瀑布型还是敏捷型?一次搞懂主数据项目实施方法

在主数据项目实施的过程中&#xff0c;经常会碰到一个让人头痛的问题&#xff0c;我该选择什么样的实施方法才能够更为高效地完成项目的交付&#xff1f; 得帆经过多年在软件行业的摸爬滚打&#xff0c;总结出了适合主数据项目的实施方法。接下来我们将为大家介绍两种常用的实…

gitlab添加ssh公钥

一&#xff1a;生成公钥 桌面鼠标右击打开 Open Git Bash here (前提是安装了Git)&#xff1b; 2.输入命令 ssh-keygen -t rsa -C "123*****90qq.com"来生成新的密钥对,将其中的"123*****90qq.com"替换为你自己的电子邮件地址。 命令&#xff1a;ssh-keyg…

提升Vue3应用效率的秘诀:深入比较ref与reactive!

ref 和 reactive 是 Vue3 中实现响应式数据的核心 API。ref 用于包装基本数据类型&#xff0c;而 reactive 用于处理对象和数组。尽管 reactive 似乎更适合处理对象&#xff0c;但 Vue3 官方文档更推荐使用 ref。 我的想法&#xff0c;ref就是比reactive好用&#xff0c;官方也…

Vue:vue的安装与环境的搭建

文章目录 环境搭建安装node.js&#xff08;比较简单&#xff09;安装Vue脚手架初始化启动 环境搭建 安装node.js&#xff08;比较简单&#xff09; 首先要安装node.js&#xff0c;进入官网下载即可。 更改安装路径&#xff0c;保持默认配置&#xff0c;一直点击下一步安装即可…

(undone) 如何计算 Hessian Matrix 海森矩阵 海塞矩阵

参考视频1&#xff1a;https://www.bilibili.com/video/BV1H64y1T7zQ/?spm_id_from333.337.search-card.all.click 参考视频2&#xff08;正定矩阵&#xff09;&#xff1a;https://www.bilibili.com/video/BV1Ag411M76G/?spm_id_from333.337.search-card.all.click&vd_…

如何电脑录屏?教你3分钟快速掌握!

在当今数字化时代&#xff0c;电脑录屏已成为一项必不可少的技能。无论是录制游戏画面、线上课程还是软件演示&#xff0c;录屏都可以帮助用户更好地保存和分享信息。可是如何电脑录屏呢&#xff1f;在本文中&#xff0c;我们将介绍两种常用的电脑录屏方法&#xff0c;并分步骤…

【nvm切换node版本,发现npm无法使用,简单粗暴的解决方案】

nvm切换node版本&#xff0c;发现npm无法使用&#xff0c;简单粗暴的解决方案 使用了nvm切换指定node版本后&#xff0c;发现npm命令无法使用。 在nodejs官网找到这部分内容 找到需要安装的压缩包 把解压的文件放入到自己的nvm文件夹内 这部分是解压的nodejs 示例

HarmonyOS—低代码开发Demo示例

接下来为大家展示一个低代码开发的JS工程的Demo示例&#xff0c;使用低代码开发如下华为手机介绍列表的HarmonyOS应用/服务示例。 1.删除模板页面中的控件后&#xff0c;选中组件栏中的List组件&#xff0c;将其拖至中央画布区域&#xff0c;松开鼠标&#xff0c;实现一个List组…

Langchain-Chatchat:离线运行的大模型知识库 | 开源日报 No.182

chatchat-space/Langchain-Chatchat Stars: 22k License: Apache-2.0 基于 ChatGLM 等大语言模型与 Langchain 等应用框架实现的开源、可离线部署的检索增强生成 (RAG) 大模型知识库项目。该项目是一个可以实现完全本地化推理的知识库增强方案&#xff0c;重点解决数据安全保护…

智慧园区可视化的价值,不要再吐槽没啥用了。

2023-04-20 13:30贝格前端工场 提高园区运营效率&#xff1a;智慧园区可以通过物联网技术、大数据分析等手段&#xff0c;实现对园区内设施、设备、人员等的实时监控和管理&#xff0c;从而提高园区的运营效率&#xff0c;降低管理成本。 提升园区服务水平&#xff1a;智慧园区…

前端Vue项目无法启动服务,提示无 ‘dev‘ npm的脚本问题解决

目录 一、问题详情 二、问题解决 一、问题详情 上周还能运行的项目&#xff0c;今天突然无法执行了&#xff0c;连最基本的启动按钮也没有了&#xff0c;所有的项目本地都突然跑不起来了&#xff0c;附上截图。 二、问题解决 后来排查的根本原因有点奇葩&#xff0c;是因为…

ABBYY FineReader16文档转换、PDF管理与文档比较功能介绍

ABBYY FineReader 16作为一款OCR和PDF一体化程序&#xff0c;其强大的功能使得文档处理变得简单高效。在众多功能中&#xff0c;文档转换、PDF管理和文档比较这三大功能尤为突出&#xff0c;成为了众多企业和个人用户的首选工具。 ABBYY Finereader 16-安装包下载如下&#xff…