Django + Vue cli 3.0 访问静态资源问题
【问题背景】
用Vue clie 3.0的搭建得框架把我坑死了,在打包后,调用不到静态资源js,css,mp3等
【问题原因】
vue cli 3.0打包后,dist目录下没有static目录,而Django那边的静态资源配置只认static,其他目录好像没用
【解决方法】
现在Django项目setting.py里面检查静态文件的配置

然后再去前端目录找到vue cli 3.0的配置文件,这里有个坑就是,vue cli 3.0的已经没有config目录,配置文件需要手动添加,如果没有vue.config.js则要新建一个,更改为
module.exports = {
// 输出目录
assetsDir: 'static',
// 基本路径
// baseUrl: './',
};
这样用npm run build打包出来的dist文件里面就有static目录了
最后是文件的调用,目前只能调用static里面的文件,如果有其他资源文件放在public里面的话需要转移到assets目录里面,这样在打包的时候才会被打进static目录。
(在public里面的资源文件是不会被webpack打包的,而是会被直接复制到dist目录里面,最后会出现调用不掉静态资源的问题。所以最好把mp3.png之类的静态资源放到assets目录)
Django + Vue cli 3.0 访问静态资源问题的更多相关文章
- Vue Cli 3 打包上线 静态资源404问题解决方案
报错原因:静态资源丢失 解决方案 官方文档https://cli.vuejs.org/zh/config/#vue-config-js baseUrl 从 Vue CLI 3.3 起已弃用,请使用pu ...
- django 不能访问静态资源的解决办法
最近在中文win10下使用python的django搭建web测试服务器,发现一个诡异的现象,正常配置好django的模型,视图和模板, 1.setting.py内容如下: ""& ...
- django 访问静态资源
urlpatterns = patterns('', url(r'^$', views.show, name='index'), url(r'^static/(?P<path>.*)', ...
- Vue CLI 3.0脚手架如何在本地配置mock数据
前后端分离的开发模式已经是目前前端的主流模式,至于为什么会前后端分离的开发我们就不做过多的阐述,既然是前后端分离的模式开发肯定是离不开前端的数据模拟阶段. 我们在开发的过程中,由于后台接口的没有完成或 ...
- spring访问静态资源出错,No mapping found for HTTP request with URI xxx/resources/js/jquery.min.js...
问题:spring访问静态资源出错,No mapping found for HTTP request with URI xxx/resources/js/jquery.min.js... web.x ...
- SpringMVC访问静态资源的三种方式(转)
本文转自:http://www.iigrowing.cn/springmvc_fang_wen_jing_tai_zi_yuan_de_san_zhong_fang_shi.html 如何你的Disp ...
- SpringMVC访问静态资源
SpringMVC访问静态资源 在SpringMVC中常用的就是Controller与View.但是我们常常会需要访问静态资源,如html,js,css,image等. 默认的访问的URL都会被Dis ...
- nodejs 构建本地web测试服务器 以及 解决访问静态资源的问题!
直接打开html文件,是以file:///方式打开的,这种方式很多时候会遇到跨域的问题,因此我们一般会搭建一个简易的本地服务器,来运行测试页面. 一.构建静态服务器 1.使用express模块 建立个 ...
- 用node.js express设置路径后 子路径下的页面访问静态资源路径出问题
在routes/news_mian.js 设置了访问news_main.html 的路径 '/',通知设置一个访问news-page.html的子路径'/newspage'子路径.但是在访问loacl ...
随机推荐
- git用远程库的内容覆盖本地
git fetch --all 下载远程的库的内容到本地,不做任何的合并(怎么合并可以自己选择) git reset --hard origin/master 撤销本地.暂存区.版本库(用远程服务器的 ...
- M1卡破解(自从学校升级系统之后,还准备在研究下)【转】
本文转载自: M1卡说明及使用proxmark3破解方法 看了网上写的一些关于M1卡的文章,多数有些误导之嫌.首先谈谈M1卡的规格,M1卡的容量为1KB,好多网上写8KB,这里其实是有个误区,应该是8 ...
- Tomcat实现多主多备
Nginx Upstream 实现简单双机主从热备 下面配置多主多从: upstream testproxy { server 127.0.0.1:8080; server 127.0.0.1:808 ...
- c语言学习的第13天2
#include <stdio.h> #include <malloc.h> void f(int **q) { *q=(int *)malloc(sizeof(int)); ...
- BZOJ 1724 [Usaco2006 Nov]Fence Repair 切割木板:贪心 优先队列【合并果子】
题目链接:http://www.lydsy.com/JudgeOnline/problem.php?id=1724 题意: 你要将一块长木板切成n段,长度分别为a[i](长木板的长度 = ∑ a[i] ...
- BZOJ 1201 [HNOI2005]数三角形:枚举 + 前缀和
题目链接:http://www.lydsy.com/JudgeOnline/problem.php?id=1201 题意: 有一个边长为n的正三角形网格,去掉其中一些线段,问你在这幅图中有多少个三角形 ...
- Nginx中如何限制某个IP同一时间段的访问次数
如何设置能限制某个IP某一时间段的访问次数是一个让人头疼的问题,特别面对恶意的ddos攻击的时候.其中CC攻击(Challenge Collapsar)是DDOS(分布式拒绝服务)的一种,也是一种常见 ...
- centos7搭建mysql-5.7.22主从复制
mysql7.7.22主从复制 本项目是根据真实环境搭建编写出文档,文档中的目录也是根据自己公司环境所创建.公司原来是一台服务器搭建的数据库(5.7.22),由于业务的扩展需要搭建一台从服务器,减轻主 ...
- 初入 CLR - 阅读《CLR via C#》笔记
最近买了一本书<CLR via C#>阅读了第一章 - CLR 的执行模型,对 .NET 一直提到的 CLR 和 .NET Framework 有了一个大致的了解.我理解主要体现在: ■ ...
- 《java编程思想》:设计模式(不定期更新)
1.策略设计模式 创建一个能够根据所传递的参数对象的不同而具有不同的方法,被称为策略设计模式.这类方法包含索要执行的算法中固定不变的部分,而“策略”包含变化的部分.策略就是传递进去的参数对象.在下面的 ...