Vue3.0商店后台管理系统项目实战-创建项目

简介: Vue3.0商店后台管理系统项目实战-创建项目

首先在d盘里面新建一个文件夹project,在vscode里面打开 打开终端 进入project文件夹 安装依赖

cnpm i yarn -g

初始化一个项目

vue create shop
1:按回车键,选择Manually select features (自定义)

Manually select features 自己去选择需要的功能,提供更多的特性选择。比如如果想要支持 TypeScript,就应该选择这一项。

2:9个功能特性,可以多选

回车后可进行选择,9个功能特性,可以多选: 使用方向键在特性选项之间切换,使用空格键选中当前特性,使用 a 键切换选择所有,使用 i 键翻转选项。

我的选择如下,请根据自己需要进行选择。

选择了4个 Babel、Router 、Vuex、Linter / Formatter

对于每一项的功能,此处做个简单描述:

Babel
TypeScript 支持使用 TypeScript 书写源码。
Progressive WebApp (PWA) Support PWA 支持。
Router 支持 vue-router 。
Vuex 支持 vuex 。
CSS Pre-processors 支持 CSS 预处理器。
Linter / Formatter 支持代码风格检查和格式化。
Unit Testing 支持单元测试。
E2E Testing 支持 E2E 测试。

3:选择3.0版本


4:是否选择history模式,根据自己需要选择。


5:是否选择预语言,根据自己需要选择。

是否ESlint输出,根据自己需要选择。



6:是否保存时或者提交时是进行ESlint校验,根据自己需要选择。


7:你喜欢把配置Babel, ESLint等放在哪里?

选择把配置文件放在外面,选择 In dedicated config files



8:要不要把当前的这一系列选项配置保存起来,方便下一次创建项目时复用。

一切选择完成,开始初始化项目

这里需要等待几分钟的时间

项目创建完成

进入项目并且运行项目

$ cd shop
$ npm run serve或者  yarn serve

最后在浏览器打开

这里可以看见项目的

文件和目录结构

node_modules 存放所有依赖
public favicon.ico 浏览器左上角显示的图标
index.html 项目最终上线的代码
src文件夹 assets文件夹:存放静态资源,包括图标、图片等
components文件夹:存放一般组件
router文件夹:配置路由
store文件夹:配置状态管理
views文件夹:存放路由组件
App.vue:根组件
main.js:项目组入口js文件,引入第三方的库和插件
.browserslistrc 管理浏览器版本的
.gitignore 上传git中忽略的文件
bable.config.js 配置bable的,转移js语法
package-lock.json 所有包的具体信息
package.json 包管理文件
README.md 项目介绍
相关文章
|
JSON JavaScript 前端开发
Vue+ElementUI 搭建后台管理系统(实战系列五)
Vue+ElementUI 搭建后台管理系统(实战系列五)
251 1
|
搜索推荐 云计算
在线教育平台
在线教育平台
1102 3
|
并行计算
最新YOLOv8(2023年8月版本)安装配置!一条龙傻瓜式安装,遇到问题评论区提问
最近需要使用YOLOv8,百度了一下现在网上大多数教程都是比较早期的教程,很多文件已经大不相同,于是我根据官方readme文档,总结了一套安装方法,只需要按照本教程,复制每一段代码,按照教程配置好相应文件即可直接使用。
8245 2
|
运维 Kubernetes 安全
利用服务网格实现全链路mTLS(一):在入口网关上提供mTLS服务
阿里云服务网格(Service Mesh,简称ASM)提供了一个全托管式的服务网格平台,兼容Istio开源服务网格,用于简化服务治理,包括流量管理和拆分、安全认证及网格可观测性,有效减轻开发运维负担。ASM支持通过mTLS提供服务,要求客户端提供证书以增强安全性。本文介绍如何在ASM入口网关上配置mTLS服务并通过授权策略实现特定用户的访问限制。首先需部署ASM实例和ACK集群,并开启sidecar自动注入。接着,在集群中部署入口网关和httpbin应用,并生成mTLS通信所需的根证书、服务器证书及客户端证书。最后,配置网关上的mTLS监听并设置授权策略,以限制特定客户端对特定路径的访问。
318 2
|
测试技术
专业CMA\CNAS软件测评报告服务商介绍
CMA/CNAS认证在软件行业中扮演关键角色,提供权威的软件测评报告。CMA确保测试数据准确性,而CNAS认可的实验室遵循国际标准。柯信优创作为专业服务商,拥有CMA/CNAS资质,丰富的测试经验,深厚的行业知识,优质服务,可提供可靠报告,助力提升软件质量和安全性。适用于需软件测评报告的企业。来源:柯信优创信息技术服务有限公司官网。
专业CMA\CNAS软件测评报告服务商介绍
|
监控 Ubuntu 安全
|
XML Java 数据格式
深入理解Spring中的依赖注入原理
深入理解Spring中的依赖注入原理
|
监控 数据挖掘 API
案例研究:如何通过淘宝天猫商品销量数据分析竞争对手
淘宝天猫的商品销量数据接口主要用于商品数据分析和监控业务,通过这些接口可以获取商品的实时销量、30天销量以及总销量等详细信息。以下是关于这一数据接口的详细介绍:
|
XML 数据可视化 算法
目标检测YOLO数据集的三种格式及转换
目标检测YOLO数据集的三种格式及转换
|
Java Spring 容器
@Resource注解是什么作用,和@bean区别是什么?
@Resource注解是什么作用,和@bean区别是什么?
408 0

热门文章

最新文章