Vue 环境安装以及项目创建

news2024/11/17 13:56:12

环境安装

nodejs 安装

下载地址:https://nodejs.org/dist/v18.16.1/
根据系统类型选择对应安装包,选择安装路径那个后一直下一步即可安装完成。
配置npm 代理镜像,设置为淘宝的镜像地址(后面按照依赖可以加速下载安装包)

npm config set registry https://registry.npmmirror.com

安装cnpm (可选)

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

查看是否安装成功
在这里插入图片描述

项目创建并启动

cmd 进入需要创建vue工程的目录下,输入如下命令并执行

npm init vue@latest

在这里插入图片描述
第一次我们可以在输入项目名称后其他选项都默认选择否(项目名称都使用小写字母)
然后执行提示命令进行启动:

  cd vue-base  进入到vue工程根目录下
  npm install  安装工程所需要的依赖
  npm run dev  启动vue工程

在这里插入图片描述

到这里项目启动完成,浏览器访问 http://localhost:5173/ 即可打开vue项目页面
这里的VITE 为vue的一个脚手架工具,在vue早前一些版本 使用的为webpacke脚手架工具。
在这里插入图片描述

项目目录

在这里插入图片描述

.idea 										--- 开发工具的配置文件夹(默认创建出来的为 .vscode)
node_modules 						--- Vue项目的运行依赖文件夹
public										--- 资源文件夹(如包含浏览器图标)
src											---源码文件夹
.gitignore									---git忽略文件
index.html								---入口HTML
package.json							---信息描述文件
README.md							---项目介绍文件
vite.config.js							---Vue配置文件

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

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

相关文章

【C++进阶】哈希 + unordered系列容器

👦个人主页:Weraphael ✍🏻作者简介:目前学习C和算法 ✈️专栏:C航路 🐋 希望大家多多支持,咱一起进步!😁 如果文章对你有帮助的话 欢迎 评论💬 点赞&#x1…

前端css、js、bootstrap、vue2.x、ajax查漏补缺(1)

学到的总是忘,遇到了就随手过来补一下 1.【JS】innerHTML innerHTML属性允许更改HTML元素的内容可以解析HTML标签 2.【CSS】display: none 设置元素不可见,不占空间,约等于将元素删除一样,只是源代码还存在 3.【CSS】行内样式 4.【…

机器学习专项课程03:Unsupervised Learning, Recommenders, Reinforcement Learning笔记 Week01

Week 01 of Unsupervised Learning, Recommenders, Reinforcement Learning 本笔记包含字幕,quiz的答案以及作业的代码,仅供个人学习使用,如有侵权,请联系删除。 课程地址: https://www.coursera.org/learn/unsupervi…

前端视角对Rust的浅析

概述 本文将从 Rust 的历史,前端的使用场景和业界使用案例一步步带你走进 Rust的世界。并且通过一些简单的例子,了解 Rust 如何应用到前端,提高前端的生产效率。 Rust简史 2006年,软件开发者Graydon Hoare在Mozilla工作期间&#…

单细胞Seurat - 细胞聚类(3)

本系列持续更新Seurat单细胞分析教程,欢迎关注! 维度确定 为了克服 scRNA-seq 数据的任何单个特征中广泛的技术噪音,Seurat 根据 PCA 分数对细胞进行聚类,每个 PC 本质上代表一个“元特征”,它结合了相关特征集的信息。…

【三维重建】【slam】【分块重建】LocalRF:逐步优化的局部辐射场的鲁棒视图合成

项目地址:https://localrf.github.io/ 题目:Progressively Optimized Local Radiance Fields for Robust View Synthesis 来源:KAIST、National Taiwan University、Meta 、University of Maryland, College Park 提示:文章用了s…

学习Android的第十八天

目录 Android 可复用 BaseAdapter 为什么使用BaseAdapter? 如何使用BaseAdapter? Android GridView 网格视图 GridView 属性 示例 Android Spinner 下拉选项框 Spinner Spinner 属性 示例 Android AutoCompleteTextView 自动完成文本框 Auto…

观成科技:加密C2框架Covenant流量分析

工具介绍 Covenant是一个基于.NET的开源C2服务器,可以通过HTTP/HTTPS 控制Covenant agent,从而实现对目标的远程控制。Covenant agent在与C2通信时,使用base64/AES加密载荷的HTTP隧道构建加密通道。亦可选择使用SSL/TLS标准加密协议&#xf…

【C/C++】inline内联函数详解

创作不易&#xff0c;本篇文章如果帮助到了你&#xff0c;还请点赞 关注支持一下♡>&#x16966;<)!! 主页专栏有更多知识&#xff0c;如有疑问欢迎大家指正讨论&#xff0c;共同进步&#xff01; &#x1f525;c系列专栏&#xff1a;C/C零基础到精通 &#x1f525; 给大…

使用drawio画数据库实体关系图

在drawio中使用数据库实体关系图 drawio是一款强大的图表绘制软件&#xff0c;支持在线云端版本以及windows, macOS, linux安装版。 如果想在线直接使用&#xff0c;则直接输入网址drawon.cn或者使用drawon(桌案), drawon.cn内部完整的集成了drawio的所有功能&#xff0c;并实现…

如何利用ChatGPT搞科研?论文检索、写作、基金润色、数据分析、科研绘图(全球地图、植被图、箱型图、雷达图、玫瑰图、气泡图、森林图等)

以ChatGPT、LLaMA、Gemini、DALLE、Midjourney、Stable Diffusion、星火大模型、文心一言、千问为代表AI大语言模型带来了新一波人工智能浪潮&#xff0c;可以面向科研选题、思维导图、数据清洗、统计分析、高级编程、代码调试、算法学习、论文检索、写作、翻译、润色、文献辅助…

【STM32】STM32学习笔记-WDG看门狗(46)

00. 目录 文章目录 00. 目录01. WDG简介02. IWDG概述03. IWDG框图04. IWDG键寄存器05. WWDG简介06. WWDG框图07. WWDG工作特性08. IWDG和WWDG对比09. 预留10. 附录 01. WDG简介 WDG&#xff08;Watchdog&#xff09;看门狗 看门狗可以监控程序的运行状态&#xff0c;当程序因为…

ubuntu20.04安装docker及运行

ubuntu20.04安装docker及运行 ubuntu环境版本 Ubuntu Focal 20.04 (LTS) 查看系统版本 rootubuntu20043:~# cat /proc/version Linux version 5.15.0-78-generic (builddlcy02-amd64-008) (gcc (Ubuntu 11.3.0-1ubuntu1~22.04.1) 11.3.0, GNU ld (GNU Binutils for Ubuntu) …

基于Eclipse+Tomcat+Mysql开发的网络考试系统的设计与实现

基于EclipseTomcatMysql开发的网络考试系统的设计与实现 项目介绍&#x1f481;&#x1f3fb; 网络考试系统主要用于实现高校在线考试&#xff0c;基本功能包括&#xff1a;自动组卷、试卷发布、试卷批阅、试卷成绩统计等。本系统结构如下&#xff1a; &#xff08;1&#xff0…

C++重点---STL简介

顾得泉&#xff1a;个人主页 个人专栏&#xff1a;《Linux操作系统》 《C从入门到精通》 《LeedCode刷题》 键盘敲烂&#xff0c;年薪百万&#xff01; 一、STL简介 STL&#xff08;Standard Template Library&#xff09;是C标准库中的一个重要组成部分&#xff0c;它提供了…

8 easy 14. 最长公共前缀

纵向扫描法&#xff1a; //编写一个函数来查找字符串数组中的最长公共前缀。 // // 如果不存在公共前缀&#xff0c;返回空字符串 ""。 // // // // 示例 1&#xff1a; // // //输入&#xff1a;strs ["flower","flow","flight"…

Keras 3.0发布:全面拥抱 PyTorch!

Keras 3.0 介绍 https://keras.io/keras_3/ Keras 3.0 升级是对 Keras 的全面重写&#xff0c;引入了一系列令人振奋的新特性&#xff0c;为深度学习领域带来了全新的可能性。 多框架支持 Keras 3.0 的最大亮点之一是支持多框架。Keras 3 实现了完整的 Keras API&#xff0c;…

面试笔记系列八之JVM基础知识点整理及常见面试题

类实例化加载顺序 加载&#xff1a;当程序访问某个类时&#xff0c;JVM会首先检查该类是否已经加载到内存中。如果尚未加载&#xff0c;则会进行加载操作。加载操作将类的字节码文件加载到内存&#xff0c;并为其创建一个Class对象。 连接&#xff08;验证、准备、解析&#x…

Qt程序设计-指南针自定义控件实例

本文讲解Qt指南针自定义控件实例。 效果演示 创建指南针类 #ifndef COMPASS_H #define COMPASS_H#include <QWidget> #include <QWidget> #include <QTimer> #include <QPainter> #include <QPen> #include <QDebug> #include <QtMat…

【MATLAB】REMD_ MFE_SVM_LSTM 神经网络时序预测算法

有意向获取代码&#xff0c;请转文末观看代码获取方式~也可转原文链接获取~ 1 基本定义 REMD_MFE_SVM_LSTM神经网络时序预测算法是一种结合了REMD&#xff08;Reservoir Enhanced Multi-scale Deep Learning&#xff09;算法、多尺度特征提取&#xff08;MFE&#xff09;、支持…