gitee之部署vue项目dist目录

gitee之部署vue项目dist目录

功能描述:将vue项目中打包后的dist目录使用Gitte pages部署,使其可以访问。

问题:部署后文件路径找不到

解决方法:配置vue.config.js中的publicPath属性,将部署项目项目名配置在publicPath属性中,例:

publicPath: ‘/skymapcoordinatetool/‘,

注意:

1.publicPath在vue3.3之前为baseUrl属性,在3.3后废除

2.outputDir、assetsDir、indexPath属性必填,例:

outputDir: ‘dist‘,
assetsDir: ‘static‘,
indexPath: ‘index.html‘,

3.在Gitte pages中配置部署目录时,部署为dist

钻研不易,转载请注明出处、、、、、、

原文地址:https://www.cnblogs.com/s313139232/p/12686430.html

时间: 2024-10-11 14:45:37

gitee之部署vue项目dist目录的相关文章

CentOS7 安装nginx部署vue项目

简单描述:代码开发完了,需要环境来运行测试.服务器上没有nginx,搞起搞起. 在Centos下,yum源不提供nginx的安装,可以通过切换yum源的方法获取安装.也可以通过直接下载安装包的方法,**以下命令均需root权限执行**:   首先安装必要的库(nginx 中gzip模块需要 zlib 库,rewrite模块需要 pcre 库,ssl 功能需要openssl库).选定**/usr/local**为安装目录,以下具体版本号根据实际改变. 安装:1.安装gcc gcc-c++(如新环境

ngnix 部署 vue项目-基础篇

ngnix 部署 vue项目-基础篇 标签(空格分隔): docker ngnix vue Dockerfile 目录 基础知识 主要知识点 ###1.基础知识 image container docker 命令 build run rm rmi exec Dockerfile npm 打包vue项目 ###2.主要知识点 Dockerfile image container 简单来讲,Dockerfile构建出Docker镜像,通过Docker镜像运行Docker容器. Dockerfile

怎样理解 Vue 项目的目录结构?

  Vue 项目的目录结构如下, 我们将会在后面逐个去了解它们的作用: 01. build - 存储项目构建相关的代码, 比如 webpack. 02. config - Vue 的配置目录,包括端口号等, 分为开发环境 / 测试环境 / 生产环境. 03. node_modules - 存储项目的各种依赖模块, 比较大, 平时通过 npm install xxx 安装的库就放在这里 04. src - 项目的开发目录, 包括图片目录 / 入口文件 / 组件 / 路由 / 核心文件等 05. s

Vue项目开发目录结构

最近做一些CI+Vue开发的简单项目,由于刚开始一直从事后端,对Vue了解不是很多,fork了团队的项目代码发现项目的文件夹很多,一时间有些懵,上网上参考了部分资料,博客园中的放晴的天空与狮子爱吃草两位的博客提供了很大的帮助,现将该部分知识做以下总结. 下图为Vue项目文件夹: 以下就项目文件夹中的各文件的作用进行介绍: ├── build/ # Webpack 配置目录 ├── dist/ # build 生成的生产环境下的项目 ├── config/ # Vue基本配置文件,可以设置监听端口

vue项目更换目录后执行npm run dev 就报错(新手进)

在我们搭建好一个VUE项目的环境后,觉得这个项目存放的位置不好,想移动一下,但是移动后我们发现执行npm run dev就会报下面的错误: 明明只是移动了一下位置,就报错,实在是太恶心了. 但是只要我们细心看一下错误:,然后去node_modules文件夹下去找这个包,会发现这个包是这样的 我们发现:这只是一个快捷方式,根本就不是我们下载的module 如果只有一个是这样,我们直接使用npm install semver就OK了,但是很遗憾,这样的东西不是一个而是几百个: 无语...总不能一个个

了解vue项目的目录结构

希望可以帮到初学vue的同学. 这里解释一下vue-cli生成的项目结构中每一个文件是做什么的? 1 build 和 config  这两个文件夹都是webpack配置相关. 2 node_modules  是 npm install 时安装的依赖代码库. 3 src 是存放源码的文件夹(开发的代码). 4 staic 是存放第三方静态资源的文件夹. 5 babelrc  是babel的一些配置(es6语法转换相关) 其中:  presets : 预设.  stage-2:就是2到3 ,一共是0

用wackpack初始化一个vue项目的目录讲解

1.初始化:我在F:\vue+node商城demo\vue+express+node+wackpack目录中初始化一个imoocdemo项目: 之后,进入 imoocdemo 文件夹输入npm install安装依赖的包: 完成后,目录如下: 我在vscode打开后如下:

docker-compose 部署 Vue+SpringBoot 前后端分离项目

一.前言 本文将通过docker-compose来部署前端Vue项目到Nginx中,和运行后端SpringBoot项目 服务器基本环境: CentOS7.3 Dokcer MySQL 二.docker-compose 部署Vue+SpringBoot 前后端分离项目 整体项目配置结构,这里在不影响原来项目的结构,因此将所有配置文件都提出来存放到docker文件夹内了,但注意docker-compose文件须放到项目总的根目录下哦! 1.新增后端所需配置文件api-Dockerfile # 指定基

Vue.js系列(一):Vue项目创建详解

引言 Vue.js作为目前最热门最具前景的前端框架之一,其提供了一种帮助我们快速构建并开发前端项目的新的思维模式.本文旨在帮助大家认识Vue.js,并详细介绍使用vue-cli脚手架工具快速的构建Vue项目,以及对项目目录结构的解释说明,使大家清晰的了解Vue项目的开发流程. 简介 Vue (读音 /vju?/,类似于 view) 是一套用于构建用户界面的渐进式框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用.Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项