使用vite搭建前端项目

news2024/11/16 12:48:21

1、在vscode 终端那里执行创建前端工程项目,其中shop-admin为项目名称:

npm init vite-app  shop-admin

提示如需安装其他依赖执行npm install ....,否则忽略(第三步再讲)。

2、执行npm run dev 命令直接运行创建好的项目,在浏览器打开链接地址,可观看前端效果。

npm run dev 

3、如需要在项目中使用库,可在项目中执行使用npm install 命令执行安装,例如引入less库 

less:npm install less less-loader -D

4、使用vite打包命令,这里只是简单讲述打包,域名配置代理,那一部分跳过不讲。

npm run build

执行打包命令后,可以用看到,多一个dist目录。dist目录下为打包结果。

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

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

相关文章

变量的引用

1、变量 和 数据 都是保存在 内存 中的 2、在 Python 中 函数的参数传递以及返回值都是靠引用传递的 引用的概念 在 Python 中变量 和 数据 是分开存储的;数据 保存在内存中的一个位置;变量 中保存着数据在内存中的地址;变量 中 记录数据的…

初步认识Java

文章目录 一、什么是Java1、Java语言的重要性2、Java语言的发展史3、Java语言的特性 二、初识Java的main方法1、main方法示例2、运行Java程序3、JDK、JRE、JVM之间的关系 三、注释四、标识符 一、什么是Java Java是一种优秀的程序设计语言,它具有令人赏心悦目的语法…

依靠继承与聚合,实现maven搭建分布式项目

简介聚合 对于复杂的Maven项目,一般建议采用多模块的方式来设计开发,便于后期维护管理。但是构建项目时,如果每次都需要按模块一个一个进行构建会十分麻烦,而Maven的聚合功能就可以很好的解决这个问题,当用户对聚合模…

软件企业知识库应用场景?如何搭建软件企业知识库?

想要减少人工干预、减少不必要的时间和人力成本、快速获取准确信息……这些应用场景对于我们企业来说是非常渴望在短期内实现的。 软件企业知识库 因为传统知识库仅仅是存储:知识只是“存储”,根本用不起来,缺乏有效的管理方式和储存载体&am…

【项目设计】网络对战五子棋(下)

我不再装模作样地拥有很多朋友,而是回到了孤单之中,以真正的我开始了独自的生活。有时我也会因为寂寞而难以忍受空虚的折磨,但我宁愿以这样的方式来维护自己的自尊,也不愿以耻辱为代价去换取那种表面的朋友。 文章目录 一、项目设…

理解Hash表

注:本文翻译自 https://www.baeldung.com/cs/hash-tables 1 介绍 有效管理数据的技术是计算机科学的传统热点。除了存储数据之外,从存储中高效地恢复数据是另一个相关问题。 即使使用最好的算法处理某些特定的数据,如果没有优化数据管理&a…

Linux C语言开发-D2vi编辑器使用

三种模式基础 命令行模式、插入模式和底行模式 :! [命令]:可在命令行模式下执行命令 :w test1.cc可备份当前编辑的文件 :r head.h可为当前文件引入头文件 u:撤销 命令行进入插入模式: i:从当前光标位置之前开始插入 …

mac安装+配置python3环境

一、python3下载 官网下载 https://www.python.org/ 二、python3安装 打开下载好的.pkg文件一直继续确认即可。 三、验证是否安装成功 打开终端,输入python3,如果返回python对应的版本信息,则安装成功。 四、python配置 如果需要输入…

c语言刷题(第8周)

输入整数m,n(m<n),输出[m,n]之间所有能被3,不能被4整除的所有数并求和,输出时每行显示5个数。 题干输入整数m,n(m<n),输出[m,n]之间所有能被3,不…

【深蓝学院】手写VIO第7章--VINS初始化和VIO系统--作业

0. 内容 1. T1 1. 下载EuRoc数据集(optional) 因为作业主要使用Ch2生成的数据,所以这一步也是可选的,但是为了整个系统的bring up,可以先用EuRoc数据集跑起来。 下载EuRoc数据集,SLAM相关数据集链接 2.…

windows平台下Qt Creator的下载与安装流程

下载 下载地址:https://download.qt.io/archive/ 下载界面 进入qt或者qtcreator都可以 版本选择 这里我选择进入qt进行下载,进入之后有多个版本可以选择。 注意:从Qt5.15版本开始,Qt公司不在提供开源离线安装程序,此…

2.6.C++项目:网络版五子棋对战之数据管理模块-游戏房间管理模块的设计

文章目录 一、意义二、功能三、作用四、游戏房间类基本框架五、游戏房间管理类基本框架七、游戏房间类代码八、游戏房间管理类代码 一、意义 对匹配成功的玩家创建房间,建立起一个小范围的玩家之间的关联关系! 房间里一个玩家产生的动作将会广播给房间里…

寻找一罐app里的隐藏海

一、前言 (一)一罐app简介 一罐app 是一款小众交友软件,可以匿名or真身发布动态 (二)开发目的 因为某些原因,某些板块被隐藏起来了。(一罐称板块为xxx海) (三&#…

常见面试题-Netty专栏(一)

typora-copy-images-to: imgs Netty 是什么呢?Netty 用于做什么呢? 答: Netty 是一个 NIO 客户服务端框架,可以快速开发网络应用程序,如协议服务端和客户端,极大简化了网络编程,如 TCP 和 UDP …

手搭手Ajax经典基础案例省市联动

环境介绍 技术栈 springbootmybatis-plusmysql 软件 版本 mysql 8 IDEA IntelliJ IDEA 2022.2.1 JDK 1.8 Spring Boot 2.7.13 mybatis-plus 3.5.3.2 pom.xml <?xml version"1.0" encoding"UTF-8"?> <project xmlns"http:/…

MYSQL(事务+锁+MVCC+SQL执行流程)理解

一)事务的特性: 一致性:主要是在数据层面来说&#xff0c;不能说执行扣减库存的操作的时候用户订单数据却没有生成 原子性:主要是在操作层面来说&#xff0c;要么操作完成&#xff0c;要么操作全部回滚&#xff1b; 隔离性:是自己的事务操作自己的数据&#xff0c;不会受到到其…

有哪些好用的程序员接私活平台?

程序员如何在苦逼的生活中&#xff0c;呼吸一口富贵又自由的空气? 接单的话&#xff0c;如何脱颖而出&#xff1f; 又该用什么平台呢&#xff1f;哪些平台会更靠谱一点呢&#xff1f; 会不会被坑? balabalabalabala......太多问题了&#xff0c;核心还是不了解这里面的详情。…

从理解概念开始,彻底学会linux下的磁盘扩容操作

对于linux磁盘空间不足需要扩容的情况&#xff0c;其他文章一般只介绍要如何操作&#xff0c;使用什么样的命令&#xff0c;但是不去介绍为什么要这么做&#xff0c;搞得好多小白一头雾水。本文从linux的文件系统开始讲起&#xff0c;帮你彻底学会linux系统中的磁盘扩容操作。 …

科学指南针iThenticate自助查重系统重磅上线

科学指南针&#xff0c;一直致力于为科研工作者提供高效、专业的学术支持&#xff0c;近日推出了全新的iThenticate自助查重系统。这一系统的上线&#xff0c;旨在为广大科研工作者提供更加便捷、准确的论文查重服务&#xff0c;进一步规范英文使用&#xff0c;提升科研质量。 …

使用Packstack安装器安装一体化OpenStack云平台

【实训目的】 初步掌握OpenStack快捷安装的方法。掌握OpenStack图形界面的基本操作。 【实训准备】 &#xff08;1&#xff09;准备一台能够安装OpenStack的实验用计算机&#xff0c;建议使用VMware虚拟机。 &#xff08;2&#xff09;该计算机应安装CentOS 7&#xff0c;建…