1.vue使用vite构建初始化项目

news2025/2/23 13:34:14
npm create vue@latest

npm create vue@latest

> npx
> create-vue


Vue.js - The Progressive JavaScript Framework

✔ Project name: … vue3_test
✔ Add TypeScript? … No / Yes
✔ Add JSX Support? … No / Yes
✔ Add Vue Router for Single Page Application development? … No / Yes
✔ Add Pinia for state management? … No / Yes
✔ Add Vitest for Unit Testing? … No / Yes
✔ Add an End-to-End Testing Solution? › No
✔ Add ESLint for code quality? › No

Scaffolding project in /home/ying/VueProj/vue3_test...

Done. Now run:

  cd vue3_test
  npm install
  npm run dev

在这里插入图片描述
进入刚刚创建的目录,并安装依赖
2.

cd vue3_test
npm i

这个时候,npm安装可能一直在转圈圈,没有显示进度,我们可以通过查看网速状态来观察是否正常下载。

npm i

added 175 packages, and audited 176 packages in 1m

45 packages are looking for funding
  run `npm fund` for details

8 moderate severity vulnerabilities

To address issues that do not require attention, run:
  npm audit fix

To address all issues possible (including breaking changes), run:
  npm audit fix --force

Some issues need review, and may require choosing
a different dependency.

Run `npm audit` for details.

其他

npm run dev的dev来源
在这里插入图片描述
目录结构
在这里插入图片描述
index.html
内容多是因为这个main.ts,通过src引入
在这里插入图片描述
main.ts里引入了App.vue并挂载到了id为app的标签
在这里插入图片描述
进入App.vue发现是由其他组件在这个根组件(App.vue)内"拼接"的
在这里插入图片描述

vscode推荐的插件
在这里插入图片描述

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

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

相关文章

在PyCharm中运行Jupyter Notebook的.ipynb文件及其pycharm软件的基础使用

(注意需使用PyCharm专业版,学生、教师可以申请免费使用:https://www.jetbrains.com/shop/eform/students) 1. pycharm2024版汉化 https://blog.csdn.net/m0_74103046/article/details/144560999 2. pycharm中的python控制台和J…

深度体验通义灵码2.0 AI 程序员

通义灵码2.0 作为一名开发者,我去年就使用过1.0,近期有幸体验了 2.0,这是一款集成了 Deepseek 大模型的智能编码助手。在这次体验中,我深入探索了新功能开发、跨语言编程、单元测试自动生成、图生代码等多个场景,深刻…

Coroutine协程

cooperation 协作 routine 程序,常规 协程核心:函数能够被挂起suspend,当然也能被回复resume 内置函数:also 返回对象本身 扩展: 内置函数let、also、with、run、apply大大提高你的开发效率! 协程的作用:…

使用IDEA提交SpringBoot项目到Gitee上

登录Gitee并新建仓库 创建本地仓库 提交本地代码到本地仓库 提交本地代码到远程仓库

Windows安装MySQL指南

1.下载 下载地址:https://www.mysql.com/downloads/ 下载版本:MySQL Installer for Window 2.安装MySQL 以下只列出需要注意的一些界面,没出现的界面默认继续即可。 1.选择安装类型 提供了多种安装模式,包括默认开发版、仅…

汽车免拆诊断案例 | 2013 款奔驰 S300L 车起步时车身明显抖动

故障现象  一辆2013款奔驰S300L车,搭载272 946发动机,累计行驶里程约为15万km。车主反映,将挡位置于D挡,稍微释放一点制动踏板,车辆蠕动时车身明显抖动,类似气缸失火时的抖动,又类似手动变速器…

从0开始:OpenCV入门教程【图像处理基础】

图像处理基础 一、OpenCV主要功能及模块介绍 1、内置数据结构和输入/输出 OpenCV内置了丰富的与图像处理有关的数据结构,如Image、Point、Rectangle等。core模块实现了各种基本的数据结构。imgcodecs模块提供了图像文件的读写功能,用户使用简单的命令…

Scrum方法论指导下的Deepseek R1医疗AI部署开发

一、引言 1.1 研究背景与意义 在当今数智化时代,软件开发方法论对于项目的成功实施起着举足轻重的作用。Scrum 作为一种广泛应用的敏捷开发方法论,以其迭代式开发、快速反馈和高效协作的特点,在软件开发领域占据了重要地位。自 20 世纪 90 …

个人环境配置--安装记录

根据显卡下载对应的cuda和cudnn 我使用的是docker,首先拉取镜像,我用的是ubuntu20.04 加速:pull hub.1panel.dev/ devel是开发版本 sudo docker pull hub.1panel.dev/nvidia/cuda:11.6.1-devel-ubuntu20.04先测试一下cuda有没有安装好 nvcc -V更新,安装…

win10把c盘docker虚拟硬盘映射迁移到别的磁盘

c盘空间本身就比较小、如果安装了docker服务后,安装的时候没选择其他硬盘,虚拟磁盘也在c盘会占用很大的空间,像我的就三十多个G,把它迁移到其他磁盘一下子节约几十G 1、先输入下面命令查看 docker 状态 wsl -l -v 2、如果没有停止…

开源的 LLM 应用开发平台-Dify 部署和使用

加粗样式 Dify 简介 官网 http://difyai.com/ 生成式 AI 应用创新引擎 开源的 LLM 应用开发平台 Dify 为开发者提供了健全的应用模版和编排框架,你可以基于它们快速构建大型语言模型驱动的生成式 AI 应用,将创意变为现实,也可以随时按需无…

libxls库的编译以及基于Visual studio的配置

最近有一个需求在windows处理xls,所以就需要libxls这个库,调查了一下,基于C的库的解析情况如下: 所以最理想的就是Libxlsd个开源的方案 基于历史整理的 libxls 在 MinGW 下的编译步骤 前提条件 系统:Windows&#…

抗辐照加固CAN FD芯片的商业航天与车规级应用解析

在工业自动化、智能汽车、航空航天及国防装备等关键领域,数据传输的安全性、可靠性与极端环境适应能力是技术升级的核心挑战。国科安芯推出全新一代CANFD(Controller Area Network Flexible Data Rate)芯片,以高安全、高可靠、断电…

Ollama+Deepseek+AnythingLLM搭建本地知识库

OllamaDeepseek的配置可以参考OllamaDeepseekopen-webui搭建本地知识库-CSDN博客 一,AnythingLLM安装 AnythingLLM官网地址AnythingLLM | The all-in-one AI application for everyone 下载 win64 下载完毕后安装。 二,AnythingLLM 配置 新建工作区 …

再探动态规划--背包问题

背包问题常见类型: 动态规划问题核心就两个:状态转移方程和遍历顺序 如果求组合数就是外层for循环遍历物品,内层for遍历背包。如果求排列数就是外层for遍历背包,内层for循环遍历物品。 状态转移方程是动态规划问题中的核心&…

Javascript使用Sodium库实现 aead_xchacha20poly1305_ietf加密解密,以及与后端的密文交互

Node.js环境安装 sodium-native (其他库可能会出现加密解密失败,如果要使用不一样的库,请自行验证) npm install sodium-native 示例代码,使用的是 sodium-native v4.3.2 (其他版本可能会有变化,如果要使用,请自行验…

【算法与数据结构】单调队列

目录 单调队列 使用单调队列维护滑动窗口 具体过程: 代码实现: 复杂度分析: 使用单调队列优化动态规划 例题 单调队列 单调队列(deque)是一种特殊的队列,队列中的元素始终按严格递增或者递减排列。这样就可以保证队头元素…

Mysql-------事务

事务 一、事务 (一)什么是事务: MySQL数据库事务:(database transaction): 事务是由一组SQL语句组成的逻辑处理单元,这些操作要么全做要么全不做,是一个不可分割的工作单位。 ※…

基于Martin的全国基础底图实现

概述 前面有文章基于Martin实现MapboxGL自定义底图分享了Martin的使用,本文使用网络收集的数据实现了全国基础数据的收集和基础底图。 实现后效果 实现 1. 数据准备 实例中包含如下数据: 边界线和九段线数据省边界面数据省会城市点数据市边界面数据…

网络安全:防范NetBIOS漏洞的攻击

稍微懂点电脑知识的朋友都知道,NetBIOS 是计算机局域网领域流行的一种传输方式,但你是否还知道,对于连接互联网的机器来讲,NetBIOS是一大隐患。 漏洞描述 NetBIOS(Network Basic Input Output System,网络基本输入输…