vue-cli4如何打包静态资源到指定目录
作者：Amorleon 发布时间：2024-05-22 10:43:24
标签：vue-cli4,打包,静态资源,目录
打包静态资源到指定目录
在最近开发工作中，我打包的 dist 文件夹下，vue-cli4 打包（npm run build）的静态资源全部都平铺展开在该文件夹下，看着很别扭，于是想打包到 static 文件夹下。
vue-cli4 执行打包命令时，默认打包的位置是dist文件夹下，不会自动打包为一个模块（文件夹）。
解决
在 vue.config.js 文件中设置 assetsDir 指定打包的目录为根目录下的 static 文件夹，就会在 dist 文件夹下自动生成一个新的文件夹 static 来存放打包的静态资源。
设置之后打包的文件目录为：
说明：文件夹下的 js 和 json 文件夹是我写在 public 文件夹下的模块用于 axios 请求本地数据，打包时会直接打包到 dist 文件夹下。
vue-cli打包访问静态资源404
使用vue-cli生产打包，把代码放到服务器上访问的时候，不少同学会看到页面一片空白，打开控制台，会发现是某些资源文件找不到，如图：
其实这里是因为vue-cli的webpack打包配置静态文件访问路径不对，配置文件路径如图：
在这个文件下面找到生产(build)配置：
要解决静态文件访问路径问题只需要修改配置中的assetsPublicPath字段即可。
如果你的服务器静态文件路径是这样的：
将路径写成这样即可访问静态资源：
资源访问成功状态：
来源：https://blog.csdn.net/weixin_45738653/article/details/107070914
0
投稿猜你喜欢
1 Git简介Git 是目前世界上最先进的分布式版本控制系统（没有之一）作用： 源代码管理为什么要进行源代码管理?- 做渗透测试的时候，有个比较大的项目，里面有几百个网站，这样你必须首先确定哪些网站是正常，哪些网站是不正常的。所以自己就编了一个小脚本，为以后
- 有时候使用到获取本机IP，就采用以下方式进行。#!/usr/bin/python import socketimport stru
- 前情回顾在上一篇中，我们通过配置基本的信息，已经让我们的项目能够正常的跑起来了。但是，这里还没有涉及到 AJAX 请求接口的内容。vue 本
- 本文实例讲述了Python Zip和Enumerate用法。分享给大家供大家参考，具体如下：Python 中的 Zipzip的作用：可以在处
- 任务描述 写小论文的利器是什么呢？LaTex！写代码的利器是什么呢？VSCode！好，那么如何在VSCode上配置
- 无论使用int还是varchar，对于Status的多选查询都是不易应对的。举例，常规思维下对CustomerStatus的Enum设置如下
- 本文实例讲述了Python实现导出数据生成excel报表的方法。分享给大家供大家参考，具体如下：#_*_coding:utf-8_*_imp
- 开发微信小程序过程中，有个需求需要用到日期时间筛选器，查看微信官方文档后，发现官方文档的picker筛选器只能单独支持日期或者是时间，所以为
- 前言本文主要给大家介绍了关于Golang实现字符串倒序的相关内容，分享出来供大家参考学习，下面话不多说了，来一起看看详细的介绍：字符串倒置如
- 请求地址var ( requestGetURLNoParams string = "http://httpbin.org/get&
- 最新的CentOS8已经内置了Python2和Python3，出入Python2和Python3两个命令可以分别进入Python2和Pyth
- 众所周知：python json 可以转换的json字符串，但是在将其转换为字典时，出现了乱序字典是一个散列结构，亦即他自身根据key进行排
- 即使在不太复杂的样式表中，也可能会有两个或者更多个规则找到同一元素。CSS通过一个叫做层叠（cascade）的过程处理这种冲突。
- 一、前期准备(windows7+mysql-8.0.18-winx64)1.下载地址：https://dev.mysql.com/downl
- 我们先看一个简单的例子：<input type="text" onblur="alert(this.va
- python基于新浪sae开发的微信公众平台，实现功能：输入段子---回复笑话输入开源+文章---发送消息到开源中国输入快递+订单号---查
- 在使用Tensor时，我们首先要掌握如何使用Tensor来定义不同数据类型的变量。Tensor时张量
- MySQL的本地备份和双机相互备份脚本：首先，我们需要修改脚本进行必要的配置,然后以root用户执行。◆1. 第一执行远程备份时先用 fir
- 在命令行中运行python代码是很常见的，下面介绍如何定义命令后面跟的参数。1 常规用法Python代码中主要使用下面
