Vue打包发布问题总汇

最新推荐文章于 2023-10-13 01:59:00 发布
最新推荐文章于 2023-10-13 01:59:00 发布
阅读量301 收藏 1
点赞数
分类专栏： # Vue问题列表 文章标签： vue 打包发布 css样式 图片显示
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_38081413/article/details/103287882
版权

**

Vue打包发布问题总汇

**
一、css样式局部样式和全局样式影响
现象：在开发环境中样式正常显示，但是到了生产环境，打包后显示出问题。
解决方法：将下图中红色标志的true改成false。（文件路径：build/webpack.prod.conf.js）
在这里插入图片描述
二、图片显示不了，提示找不到图片
现象：在开发环境中能正常显示图片，但是到了生产环境，打包后无法正常显示图片，一般是比较大的背景图片，查看元素中图片的生成路径和存在路径不一致，一般是多了个‘…/…/’
解决方法：将下图中文件红色图标位置加上"pubilcPath:’…/…/’ "。（文件路径：build/utils.js）
在这里插入图片描述

遇见y2021
关注
专栏目录
vue2 项目打包降低体积终极法则汇总
全易
04-11 1037
自定义封装的组件、指令、过滤器，任何东西都千万不要挂载全局！哪里需要哪里import尽可能的让main.js文件 import最少如果你的项目使用ElementUI的组件比较少的话，可以在此按需引入，我的项目基本全用了，就直接全引了。
Vue项目打包部署总结
最新发布
A1867350的博客
03-29 941
总结来说，面试成功=基础知识+项目经验+表达技巧+运气。我们无法控制运气，但是我们可以在别的地方花更多时间，每个环节都提前做好准备。面试一方面是为了找到工作，升职加薪，另一方面也是对于自我能力的考察。能够面试成功不仅仅是来自面试前的临时抱佛脚，更重要的是在平时学习和工作中不断积累和坚持，把每个知识点、每一次项目开发、每次遇到的难点知识，做好积累，实践和总结。点击这里领取Web前端开发经典面试题。
vue项目打包发布踩过的坑
youlinaixu的博客
11-13 4768
1.vue打包之后，背景图片不显示问题 找到build/utils.js文件 修改成为如下所示内容： 2.vue写成懒加载的方式，打包发布部署到服务器报错，修改为下面的内容config目录下的index.js的assetsPublicPath修改为下面的内容 3.vue从后台获取数据时，串接口数据，保存sessionid，vue中登录成功后台自动将token保存进入session缓存，解决前端...
vue发布后的一些问题
u011927449的博客
05-20 195
1.发布后把config/index.js 的productionSourceMap: true,改成productionSourceMap: false webpack成功隐藏
Spring boot+vue 项目发布问题记录
干货满满
10-13 130
Spring boot+vue 项目发布问题记录 后端，在start.bat中，setlocal & pushd 前加入以下代码： rem 设置控制台字符集为UTF-8 chcp 65001 解决控制台乱码 在setlocal & pushd 后加入以下代码： set "JAVA_OPTS=-Dfile.encoding=UTF-8" 解决JSON乱码 前端，在vue-cli-service.cmd中将 "%_prog%" "%dp0%\..\@vue\cli-servic
vue 打包发布去#和页面空白问题
mjlfto的博客
05-10 7457
1.vue项目中config文件下index中打包配置配置 build: { // Template for index.html index: path.resolve(__dirname, '../yiTownWebApp/index.html'), // Paths assetsRoot: path.resolve(__dirname, '../yiTownWebApp'...
vue项目打包时常遇到的一些问题（持续更新）
xt_XiTu的博客
06-02 1013
如果项目一切正常的话，打包的时候是不会报错的，显示为下图 不正常的话，就有各种问题了，以下为自己遇到的一些问题及解决办法 1、静态资源找不到 这个就算是新手打包常见问题了，改动很简单，config—index.js中把/改为./即可，如果不想每次打包都改，可以直接写成三目运算符判断process.env.NODE_ENV === “development” ? ‘/’ : ‘./’，免去每次打包更改的麻烦 build: { // Template for index.html index:
electron-vue开发环境内存泄漏问题汇总
10-16
在使用Electron结合Vue进行桌面应用开发时，内存泄漏是一个常见且需要重点关注的问题。内存泄漏问题的出现会逐渐消耗系统资源，最终可能导致应用崩溃或运行缓慢。在Electron中，内存泄漏主要跟主进程和渲染进程的...
electron-vue开发环境内存泄漏问题汇总.docx
01-13
Electron-Vue 开发环境内存泄漏问题汇总 本文主要介绍了 Electron-Vue 开发环境中内存泄漏问题的解决方案。 Electron-Vue 是一个基于 Electron 和 Vue.js 的开发框架，用于构建桌面应用程序。然而，在开发环境中，...
vue 打包发布项目404
u013568834的专栏
04-28 432
vue + nginx 发布项目 静态文件404 问题 刚接触vue 没有深入研究，说是快速开发，其实并不快，好多文档但是没有一个是从创建到发布的文档。官方文档都是说一些基础不好就听不懂的细节。 切入正题 问题如下： npm run build 打包后 用nginx 做web服务器。访问的时候css js都是404. 浏览器开发者工具Network中可以看到css js文件的路径都是少了项目名具体如下图： 端口后面没有项目名，问题还是讨人厌的绝对路径和相对路径。百度都说是什么在config/.
vue-cropper导致的template or render function not defined的报错
weixin_43969975的博客
10-21 567
记录使用vue-cropper导致的template or render function not defined的报错 解决方法：下降版本 npm uninstall vue-cropper npm install vue-cropper@0.3.6
vue安装vue-cropper报错4058
人工智障阿门的博客
08-23 291
不知道是命令提示符新建文件权限出错了还是怎样，导致它无法自己新建文件夹，所以才安装失败，所以自己手动新建一个，让它存进去就行。项目需要使用vue-cropper，安装的时候提示-4058，百度了一圈没找到答案，看报错提示是说没有文件夹。在里面新建了文件夹，命名为vue-cropper，因为他说找不到就手动给他建一个。然后重新 npm install vue-cropper，之后就不报错了。之前安装其他插件没问题的，这个报错会显得莫名其妙，但是死马当活马医，
vue3中使用vue-cropper剪裁上传图片报错：Universal Module Definition
qq_40588529的博客
11-17 2083
vue3与vue-cropper版本
vue-cropper的使用出现的问题
热门推荐
寬真
10-18 1万+
问题：上次做论坛使用了vue-cropper，方便对用户上传的图片进行裁剪之类，但是由于两个来月没管这套代码，发现这个vue-cropper竟然出现了报错。待会要研究一下。 红色波浪线处提示如下： Argument of type '{name:string;components:{VueCropper:tyoeof 'vue-cropper';}}'if not assignable...
vue-cropper报错template or render function not defined.
GracieLaw的博客
09-30 869
vue-cropper : template or render function not defined 第一次用vue-cropper，直接抄demo，结果启动后vue-cropper组件一直报template or render function not defined. 问题 引入的时候直接用了 import VueCropper from 'vue-cropper' 解决办法 引入改为 ...
vue发布遇到的问题
yanby921005的博客
04-04 211
1.兼容ie9 首先通过npm来安装babel-polyfillnpm install babel-polyfill --save-dev在webpack里面引用babel-polyfill 修改build文件夹下的webpack.base.conf.js代码。 entry: { app: ["babel-polyfill","./src/main.js"] }   2.背景图...
vue-cropper打包部署后运行报错i.call is not a function
youyudexiaowangzi的专栏
10-13 1252
既然本地运行良好，肯定直接引用vue肯定是可以用的，于是，将node_modules\vue-cropper\src目录下的vue-cropper.vue和exif-js-min.js复制到源码目录，将其当作组件调用。从npm安装的vue-cropper目录中看到vuecropper的源码，getComputedStyle的第一个参数时this.$refs.cropper，也就是说vuecropper根本就没有加载成功，标签名字已经不是用的vue-cropper，可以证明的确调用的是源码目录下的组件。
Vue webpack生产环境打包，报错：npm ERR! Failed at the vue-admin-template@4.4.0 build:prod script.
m0_63788617的博客
08-04 9515
对Vue项目进行开发环境打包时，执行 ‘npm run dev’,可以正常运行项目；查了很多资料，也没找到方法解决，有哪位大佬知道怎么解决吗？
Electron打包发布vue项目
haohan0307的博客
08-06 5879
electron发打包布vue项目，electron自动更新
Vue打包体积优化详解与CDN应用
本文档深入探讨了Vue应用程序的打包体积优化策略，着重于在Vue CLI 3环境下进行实践。首先，作者提到了项目完成后，虽然初始打包体积为1.18MB，但通过引入Webpack-bundle-analyzer插件，开发者可以细致地分析各个...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值