[笔记]vue从入门到入坟《五》vue-cli构建vue webpack项目

news2025/1/11 12:41:56

参考:
用vue-cli搭建vue项目
vue-cli 项目结构目录简介

文章目录

  • 前言
  • 一、Vue-cli介绍
  • 二、开始
    • 2.0 下载安装npm 以及git
      • npm安装
      • git安装
    • 2.1 全局安装 vue-cli
    • 2.2 创建项目
    • 目录介绍
  • 三、常见问题
  • 总结

前言

一、Vue-cli介绍

官网
简单地说就是构建vue项目的工具包,通过vue-cli会自动构建vue项目的结构。

二、开始

2.0 下载安装npm 以及git

npm安装

npm(Nodejs软件包管理工具)

官网下载地址

在这里插入图片描述
下载后双击安装即可

git安装

下载地址
在这里插入图片描述
安装git后 右键鼠标会发现git bash
在这里插入图片描述
在这里插入图片描述
后面的npm 可以在gitbash中输入命令行

2.1 全局安装 vue-cli

安装vue-cli(vue2)

npm install --global vue-cli

安装vue-cli(vue3)

 npm install -g @vue/cli

2.2 创建项目

创建名为test的项目

vue init webpack test

注意:没说明的直接回车选择默认就好
在这里插入图片描述
“Project name”:这个是项目名称,默认是输入时的那个名称,想改的话直接输入修改,也可以直接回车
“Install vue-router”:是否需要vue-router,这里默认选择使用,这样生成好的项目就会有相关的路由配置文件
“Use ESLint to lint your code”:是否使用ESLint,刚才说了我们这个项目需要使用所以也是直接回车,默认使用,这样会生成相关的ESLint配置
“Setup unit tests with Karma + Moch?”: 是否安装单元测试。由于我们现在还没有单元测试,所以这里选择的是”N”,而不是直接回车哦
“Setup e2e tests with Nightwatch”:是否安装e2e测试,这里我也同样选择的是“N” 这几个配置选择yes 或者 no 对于我们项目最大的影响就是,如果选择了yes 则生成的项目会自动有相关的配置,有一些loader我们就要配套下载。
所以如果我们确定不用的话最好不要yes,要么下一步要下很多没有用的loader

目录介绍

创建完后 用hbuilder打开就是如下图的目录结构:
在这里插入图片描述
在这里插入图片描述

三、常见问题

Error: Cannot find module ‘@dcloudio/uni-cli-i18n’

总结

简单地介绍vue-cli项目的构建,以便使用hbuilder。

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

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

相关文章

SpringBoot SpringBoot 开发实用篇 5 整合第三方技术 5.1 缓存的作用

SpringBoot 【黑马程序员SpringBoot2全套视频教程,springboot零基础到项目实战(spring boot2完整版)】 SpringBoot 开发实用篇 文章目录SpringBootSpringBoot 开发实用篇5 整合第三方技术5.1 缓存的作用5.1.1 缓存介绍5.1.2 小结5 整合第三…

【计算机组成原理Note】5.3 CPU数据通路(CPU内部总线+专用数据通路)

5.3.1 数据通路-CPU内部单总线方式 这是第一节的图,将其部件换到一边: 5.3.1.1 CPU内部单总线方式 内部总线是指同一部件,如CPU内部连接各寄存器及运算部件之间的总线; 系统总线是指同一台计算机系统的各部件,如CPU、内存、通道…

C++类型转换+特殊类的设计+单例模式+IO流+空间配置器

索引类型转换(1).C语言的类型转换(2).C四种类型转换a.static_castb.reinterpret_castc.const_castd.dynamic_castvolatile关键字(了解即可)RTTL特殊类的设计(1).设计一个类不能支持拷贝(2).设计一个类,只能在堆上创建对象(3).设计一个类,只能在栈上创建对…

[C++数据结构](33)图,图的遍历,最小生成树,最短路径算法详解

文章目录图的基本概念图的存储结构邻接矩阵邻接表实现图的遍历广度优先遍历深度优先遍历最小生成树Kruskal 算法Prim 算法最短路径Dijkstra 算法Bellman-Ford 算法Bellman-Ford 算法的队列优化Floyd 算法图的基本概念 图(Graph)是由顶点集合及顶点间的关系组成的一种数据结构&…

uni-app入门:常用事件绑定与数据同步

1.常见事件与事件绑定 1.1点击事件bindtap 1.2 文本输入事件bindinput 1.3 切换事件bindtouchend 2.数据同步 2.1事件回调 2.2逻辑层中page对象中的中数据如何进行改变 2.3页面触发事件如何传参到page中数据 …

Android 基础知识1-开发环境搭建

1.1 Android开发准备工作 配置Android开发环境之前,首先需要了解Android对操作系统的要求。它可以使用Windows XP 已经以上版本、Mac OS 、Linux等操作系统,我是以Windows系统为例学习以及开发的。 1.2 开发包以及其工具的安装和配置 Android以Java作为…

内蒙古工程学院无线网络设计与规划

摘 要 I ABSTRACT II 第1章 绪论 1 1.1选题背景及意义 1 1.1.1选题背景 1 1.1.2选题意义 1 1.1.3国内外研究现状 2 1.2需求分析 3 1.2.1建设背景 3 1.2.2总体建设目标 4 1.2.4具体实施目标 5 1.3校园无线网在教育中的发展 6 第2章 无线网络的应用 7 2.1 无线网络的概述 7 2.1.1…

【毕业设计】60-基于ZigBee无线智能消防\烟雾报警逃生系统设计(原理图工程、源代码、低重复率参考文档、实物图)

【毕业设计】60-基于ZigBee无线智能消防\烟雾报警逃生系统设计(原理图工程、源代码、低重复率参考文档、实物图) 文章目录【毕业设计】60-基于ZigBee无线智能消防\烟雾报警逃生系统设计(原理图工程、源代码、低重复率参考文档、实物图&#x…

Mybatis的一级缓存

目录前置生效场景一场景二失效场景一场景二场景三场景四场景五前置 什么是一级缓存: mybatis 默认开启一级缓存, SQLSession会话缓存, 每个SQLSession都会有各自的缓存 以下会演示一级缓存生效/失效的场景 项目地址: https://gitee.com/xmaxm/test-code/blob/master/chaim-cac…

初识golang微服务框架kratos

前言 今天给大家介绍一下Kratos,Kratos 一套轻量级 Go 微服务框架,包含大量微服务相关框架及工具,使用Kratos的原因主要是感觉原来使用的go-kit工具并不是很方便,期望用上kratos后开发会更快捷一些。 Kratos名字根据官方的説法是来源于:《战…

灵界的科学丨六、星际通信新科技──寻找外星人

摘自李嗣涔教授《灵界的科学》 外星先进文明科技领先地球的关键, 是外星人掌握了意识的物理, 能够制造仿照天眼的仪器, 自由进出虚数空间遨游宇宙,同时创造出瞬间科技。 人类未来学习的典范,就在天上无数的外星先进…

数据结构--线性表之顺序表

1.线性表定义 线性表(List):零个或多个数据元素的有限序列。 线性表的数据集合为{a1,a2,…,an},假设每个元素的类型均为DataType。其中,除第一个元素a1外,每一个元素有且只有一个直接前驱元素&#xff0c…

第三十三篇 transition-group 列表过渡

上一篇内容讲到的是transiotion&#xff0c;其中还记得有一个报错吗&#xff1f;如下&#xff1a; 先来回顾一下&#xff0c;<transition> 只能用于单个元素&#xff0c;如果在<transition>单中并列两个<p>标签&#xff0c;那么这样一来就会报以上这个错误&a…

六、表空间管理

六、表空间管理 1、查看表空间 使用DM Manager工具&#xff1a; 代码&#xff1a; -- 1、查看表空间名 select tablespace_name FROM SYS.DBA_TABLESPACES;-- 2、查看表空间名、表空间对应的数据文件地址、状态 select tablespace_name,file_name,status FROM dba_data_files;…

软件定义汽车产业生态创新白皮书

1 什么是软件定义汽车 1.1 驱动因素 汽车“新四化”的发展需要软件的加持 据大众汽车公开披露信息&#xff0c;未来平均每辆普通汽车软件代码量超 1 亿行。在电动化、智能化和网联化等的发展推动下&#xff0c;汽车将加速向高度数字化、信息化、智能化的移动终端发展。座舱娱…

CM311-1_YST_S905L3(B)_安卓9.0_设置无密码_默认打开adb_完美AI语音_线刷固件包

CM311-1_YST_S905L3(B)_安卓9.0_设置无密码_默认打开adb_完美AI语音_线刷固件包 固件特点&#xff1a; 1、修改dns&#xff0c;三网通用&#xff1b; 2、开放原厂固件屏蔽的市场安装和u盘安装apk&#xff1b; 3、无开机广告&#xff0c;无系统更新&#xff0c;不在被强制升…

LX12864P1屏幕使用介绍(ST7567驱动),显示横线、字符、图形

LX12864P1屏幕显示&#xff08;ST7567驱动&#xff09; 可编辑12864液晶模组&#xff0c;也就是液晶显示屏是有128*64个点阵组成。12864是一种图形点阵液晶显示器&#xff0c;它主要采用动态驱动原理由行驱动—控制器和列驱动器两部分组成了128(列)64(行)的全点阵液晶显示此显…

全国地级市城镇化和协调发展指数测算数据(2005-2019)六份数据

全国地级市城镇化和协调发展指数测算数据&#xff08;2005-2019&#xff09;六份数据 1、范围&#xff1a;受数据限制&#xff0c;剔除了新疆和西藏的城市共包括287个地级市 2、时间区间为&#xff1a;2005-2019年 3、六分数据包括&#xff1a; 地级市城镇化发展水平&#…

多线程入门

多线程简介 1. 进程/线程 # 进程 - 进程由指令和数据组成&#xff0c;指令要运行&#xff0c;数据要读写&#xff0c;必须将指令加载到CPU&#xff0c;数据加载到内存。指令运行过程中还需要用到磁盘&#xff0c;网络等IO设备 - 进程用来加载指令&#xff0c;管理内存&#x…

CentOS7 安装rabbitMQ步骤

全程使用root权限 1、修改主机名称 hostnamectl set-hostname rmq158 2、输入命令&#xff1a;vi /etc/hosts修改hosts文件 3、重启 4、WINSCP传输两个包到/usr/local下面 5、tar -xvf otp_src_21.3.tar.gz cd otp_src_21.3 ./configure --prefix/usr/local/erlang 6、yum i…