Vue3.X 创建简单项目

一、环境安装与检查

  • 首先,我们要确保我们安装了构建vue框架的环境,不会安装的请自行百度,有很多安装教程。
  • 检查环境
  • node -v  # 如果没有安装nodejs请安装,安装教程自行百度
    vue -V# 没有安装,请执行npm install -g @vue/cli  

     这些环境都安装了之后就可以进行vue项目的搭建了。

二、vue项目搭建

  1.  进入你要创建vue项目的目录下进行项目创建,输入:vue create “项目名称”, 例:
  2. vue create project-app
    

    选择 Manually select  features  选项,进行自行配置

  3.  选择完这几个之后回车
  4. 选择 版本 3.x

       第一个选项选择N,不要history mode for router,之后的选项都默认选择第一个,直接按回车键,直到来到这里选择是否记住上述的配置项,下次创建vue项目时还是按这种配置创建,这里我们选择N;

 

 选择N之后,我们只要等待项目创建完成即可;下图表明已经创建完成。

三、编辑项目

我用的是VScode编辑器打开,可以看看项目文件的结构

在当前目录下启动项目:npm  run  serve

 浏览器访问:http://127.0.0.1:8080

 为了不会因为格式等问题而报错,我们需要在 vue.config.js  中添加    lintOnSave: false  ,之后重新执行:npm  run  serve  重启项目,这样就不会出现格式问题的报错。

 好了,vue3.X项目的创建就结束了。

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

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

相关文章

Cesium for unity 1.5.0使用注意事项

Cesium for Unity Quickstart – Cesium 1.Unity版本仅支持Unity2021.3.2f1以后版 2.仅支持 3D (URP)和3D (HDRP)渲染管线 3.如果Package Manager中不出现My Registries选项,请在 Edit > Project Settings...>Package Manager中重命名或删除重新添加Packag…

深入浅出PHP封装根据商品ID获取淘宝商品详情数据方法

要通过淘宝的API获取商品详情,您可以使用淘宝开放平台提供的接口来实现。以下是一种使用PHP编程语言实现的示例,展示如何通过淘宝开放平台API获取商品详情: 首先,确保您已注册成为淘宝开放平台的开发者,并创建一个应用…

【微服务实战】01-工程结构概览

文章目录 工程结构概览:定义应用分层及依赖关系1.应用分层2.定义Entity3.仓储层3.1 工作单元:事务管理3.2 仓储层 4.领域事件5.APIController最佳实践 工程结构概览:定义应用分层及依赖关系 1.应用分层 领域模型层基础设施层 ⇒ 仓储应用层 ⇒ Api、后台任务Job共…

TCP服务器实现—多进程版,多线程版,线程池版

目录 前言 1.存在的问题 2.多进程版 3.多线程版 4.线程池版 总结 前言 在上一篇文章中使用TCP协议实现了一个简单的服务器,可以用来服务端和客户端通信,但是之前的服务器存在一个问题,就是当有多个客户端连接服务器的时候,服…

002-Spring boot 自动配置相关分析

目录 自动配置 EnableAutoConfiguration开启自动配置读取配置提前过滤自动配置配置包 AutoConfigurationPackage 自动配置 EnableAutoConfiguration 开启自动配置 在Spring 启动类上的 SpringBootApplication 中有 EnableAutoConfiguration 读取配置 Import(AutoConfigurat…

后端返回图片,前端接收并显示的解决方案

后端图片数据返回 后端通过二进制流的形式,写入response中 controller层 /*** 获取签到二维码*/GetMapping("/sign-up-pict")public void signUpPict(Long id, Long semId, HttpServletResponse response) throws NoSuchAlgorithmException {signUpServ…

musl libc ldso 动态加载研究笔记:01

前言 musl 是一个轻量级的标准C库,建立在系统调用之上,可以认为是【用户态】的C 库,与 glibc 或者 uClibc 属于同一类。 基于 musl 的 gcc 工具链包括交叉编译工具链,可以用于编译 Linux 或者其他的操作系统,如当前 L…

深入解析 MyBatis 中的 <foreach> 标签:优雅处理批量操作与动态 SQL

在当今的Java应用程序开发中&#xff0c;数据库操作是一个不可或缺的部分。MyBatis作为一款颇受欢迎的持久层框架&#xff0c;为我们提供了一种优雅而高效的方式来管理数据库操作。在MyBatis的众多特性中&#xff0c;<foreach>标签无疑是一个强大的工具&#xff0c;它使得…

构建可远程访问的企业内部论坛

文章目录 前言1.cpolar、PHPStudy2.Discuz3.打开PHPStudy&#xff0c;安装网页论坛所需软件4.进行网页运行环境的构建5.运行Discuz网页程序6.使用cpolar建立穿透内网的数据隧道&#xff0c;发布到公网7.对云端保留的空白数据隧道进行配置8.Discuz论坛搭建完毕 前言 企业在发展…

Python中import模块导入的实现原理

欢迎关注博主 Mindtechnist 或加入【Linux C/C/Python社区】一起探讨和分享Linux C/C/Python/Shell编程、机器人技术、机器学习、机器视觉、嵌入式AI相关领域的知识和技术。 Python中import模块导入的实现原理 什么是模块import搜索路径import导入模块的原理图书推荐 专栏&…

京东门详一码多端探索与实践 | 京东云技术团队

本文主要讲述京东门详业务在支撑过程中遇到的困境&#xff0c;面对问题我们在效率提升、质量保障等方向的探索和实践&#xff0c;在此将实践过程中问题解决的思路和方案与大家一起分享&#xff0c;也希望能给大家带来一些新的启发 一、背景 1.1、京东门详介绍 1.1.1、京东门…

VB+SQL上机考试系统设计与实现

摘 要 随着计算机技术的迅猛发展,学校教学和管理的信息化发展也有长足的进步,这就要求各个环节都均衡发展,从软硬件双方面把学校建设成一流的信息管理、教育教学的平台。本文设计开发的考试管理系统也是其中重要的一个方面。该系统本着减轻教师工作负担、提高工作效率、优…

六、分组背包

六、分组背包 题记算法题目代码 题记 一个旅行者有一个最多能装V公斤的背包和有N件物品&#xff0c;它们的重量分别是W[1]&#xff0c;W[2]&#xff0c;…,W[n]&#xff0c;它们的价值分别为C[1],C[2],…,C[n]。这些物品被划分为若干组&#xff0c;每组中的物品互相冲突&#…

【es6】函数参数设置默认值

1、es6之前的函数参数默认值写法 1.1、使用短路或||的写法 当y为空时&#xff0c;y判断为false &#xff0c;走||右边的&#xff0c;所以y world;当y不为空时&#xff0c;y判断为true&#xff0c;不需要再运行||右边的&#xff0c;所以 y y function log(x, y) {y y || W…

数据的深海潜行:数据湖、数据仓库与数据湖库之间的微妙关系

导言&#xff1a;数据的重要性与存储挑战 在这个信息爆炸的时代&#xff0c;数据已经成为企业的核心资产&#xff0c;而如何高效、安全、便捷地存储这些数据&#xff0c;更是每个组织面临的重大挑战。 数据作为组织的核心资产 数据在过去的几十年里从一个辅助工具演变成企业的…

Ubuntu 20.04(服务器版)安装 Anaconda

0、Anaconda介绍 Anaconda是一个开源的Python发行版本&#xff0c;包含了包括Python、Conda、科学计算库等180多个科学包及其依赖项。因此&#xff0c;安装了Anaconda就不用再单独安装CUDA、Python等。 CUDA&#xff0c;在进行深度学习的时候&#xff0c;需要用到GPU&#xf…

操作符详解上(非常详细)

目录 二进制介绍二进制2进制转10进制10进制转2进制数字2进制转8进制和16进制2进制转8进制2进制转16进制 原码、反码、补码移位操作符左移操作符右移操作符 位操作符&#xff1a;&、|、^逗号表达式 二进制介绍 在初学计算机时我们常常会听到2进制、8进制、10进制、16进制……

C++中String的语法及常用接口用法

在C语言中&#xff0c;string是一个标准库类&#xff08;class&#xff09;&#xff0c;用于处理字符串&#xff0c;它提供了一种更高级、更便捷的字符串操作方式&#xff0c;string 类提供了一系列成员函数和重载运算符&#xff0c;以便于对字符串进行操作和处理。 一、string…

scala TraversableOnce

scala TraversableOnce 1. 由来 TraversableOnce是Scala中的一个特质&#xff08;trait&#xff09;&#xff0c;它定义了一组操作&#xff0c;用于遍历和处理集合类型的元素。它是Scala集合层次结构中的基本概念之一。 2. 示例 以下是使用TraversableOnce的简单示例&#…

Redis高可用:主从复制详解

目录 1.什么是主从复制&#xff1f; 2.优势 3.主从复制的原理 4.全量复制和增量复制 4.1 全量复制 4.2 增量复制 5.相关问题总结 5.1 当主服务器不进行持久化时复制的安全性 5.2 为什么主从全量复制使用RDB而不使用AOF&#xff1f; 5.3 为什么还有无磁盘复制模式&#xff…