当前位置: 首页 > news >正文

从0开始搭建基于VUE的前端项目

准备与版本

  1. 安装nodejs(v20.11.1)
  2. 安装vue脚手架(@vue/cli 5.0.8) ,参考(https://cli.vuejs.org/zh/)
  3. vue版本(2.7.16),vue2的最后一个版本

初始化项目

  1. 创建一个git项目(可以去gitee/github上创建),注意创建一个空项目
  2. 创建项目
  vue create mvp-admin-vue-ui

在这里插入图片描述

  1. 删除自己创建的git
rm -rf .git

在这里插入图片描述
4. 初始化git,并创建master分支

git init
  1. 配置远程仓库地址
git remote add origin https://gitee.com/gzcltech/mvp-admin-vue-ui.git
  1. 推送项目
git push -u origin main

环境

  1. 参考(https://cli.vuejs.org/zh/guide/mode-and-env.html
  2. 在项目的根目录下面
.env                # 在所有的环境中被载入
.env.local          # 在所有的环境中被载入,但会被 git 忽略
.env.[mode]         # 只在指定的模式中被载入
.env.[mode].local   # 只在指定的模式中被载入,但会被 git 忽略
  1. 注意只有 NODE_ENV,BASE_URL 和以 VUE_APP_ 开头的变量将通过 webpack.DefinePlugin 静态地嵌入到客户端侧的代码中
  2. 内部用了 dotenv(https://github.com/motdotla/dotenv#rules)

别名配置

修改vue.config.js

configureWebpack: {resolve: {alias: {'@': resolve('src')}},
}

在这里插入图片描述

http://www.lryc.cn/news/328731.html

相关文章:

  • elementUI this.$msgbox msgBox自定义 样式自定义 富文本
  • Lua与Python区别
  • Python学习(二)
  • 管理阿里云服务器ECS -- 网站选型和搭建
  • WPF中继承ItemsControl子类控件数据模板获取选中属性
  • Android卡顿掉帧问题分析之实战篇
  • OpenKylin安装Kafka
  • 嵌入式硬件中常见的面试问题与实现
  • 【Node.JS】koa
  • 工作日志- 不定期更新
  • Qt使用opencv打开摄像头
  • Redis的Hash数据结构中100万对field和value,field是自增时如何优化?优化Hash结构。
  • 二十四种设计模式与六大设计原则(一):【策略模式、代理模式、单例模式、多例模式、工厂方法模式、抽象工厂模式】的定义、举例说明、核心思想、适用场景和优缺点
  • mac怎么删除python
  • 【笔记】Android U RILJ 中与运营商名称SPN显示相关的日志分析
  • 蓝桥杯【奇怪的捐赠】c语言
  • 【3月比赛合集】5场可报名的「创新应用」、「数据分析」和「程序设计」大奖赛,任君挑选!
  • vue3 视频播放功能整体复盘梳理
  • vue-ueditor-wrap上传图片报错:后端配置项没有正常加载,上传插件不能正常使用
  • 数据仓库的发展历程
  • MySQL开窗函数
  • Java学习笔记(23)
  • nodejs下载安装以及npm、yarn安装及配置教程
  • Playwright库page.evaluate()方法执行JavaScript 表达式
  • 【微服务】OpenFeign+Sentinel集中处理远程调用异常
  • 集合嵌套,Collections,斗地主案例,日志框架
  • maven pom relativePath属性的作用
  • 【STM32 HAL库SPI/QSPI协议学习,基于外部Flash读取。】
  • Nginx入门--初识Nginx的架构
  • 网络性能提升10%,ZStack Edge 云原生超融合基于第四代英特尔®至强®可扩展处理器解决方案发布