th:text为null报错_小猿圈web前端之vue-cli项目打包完成后运行文件路径报错问题
学习前端的小伙伴越来越多,问题也就越多,前面基础部分还好一些,特别是一到框架的时候,难住了一大部分人,今天小猿圈web前端讲师就为大家总结了vue-cli项目打包完成后运行文件路径报错问题,有兴趣的小伙伴可以看一下。
刚新建的vue-cli项目,同事说要打包一版进行测试,打包完成后放在tomcat上发现路径报错问题。
百度了一下,怀疑是build里面没有定义路径问题,度友提供了解决方案:
找到config文件夹下的index.js文件,修改路径代码
找到build对象,修改属性assetsPublicPath为‘./'
但是由于vue-cli项目中已经没有config文件夹,需要在根目录下创建vue.config.js
具体配置网上查了一下,用了一个推荐的配置:
module.exports = {
baseUrl: '/',
outputDir: 'dist',
lintOnSave: true,
runtimeCompiler: true, //关键点在这
// 调整内部的 webpack 配置。
// 查阅 https://github.com/vuejs/vue-doc-zh-cn/vue-cli/webpack.md
chainWebpack: () => {},
configureWebpack: () => {},
// 配置 webpack-dev-server 行为。
devServer: {
open: process.platform === 'darwin',
host: '0.0.0.0',
port: 8080,
https: false,
hotOnly: false,
// 查阅 https://github.com/vuejs/vue-doc-zh-cn/vue-cli/cli-service.md#配置代理
proxy: null, // string | Object
before: app => {}
}
}
但是这个配置打包完之后依旧报错,看了原因,是baseUrl:'/'的路径还是有问题,把路径改为baseUrl:'./'就能找到对应的路径了,以下为修改后代码:
module.exports = {
baseUrl: './',
outputDir: 'dist',
lintOnSave: true,
runtimeCompiler: true, //关键点在这
// 调整内部的 webpack 配置。
// 查阅 https://github.com/vuejs/vue-doc-zh-cn/vue-cli/webpack.md
chainWebpack: () => {},
configureWebpack: () => {},
// 配置 webpack-dev-server 行为。
devServer: {
open: process.platform === 'darwin',
host: '0.0.0.0',
port: 8080,
https: false,
hotOnly: false,
// 查阅 https://github.com/vuejs/vue-doc-zh-cn/vue-cli/cli-service.md#配置代理
proxy: null, // string | Object
before: app => {}
}
}
以上就是小猿圈web前端讲师对于vue-cli项目打包完成后运行文件路径报错问题的介绍,希望无论是初学还是专业前端,都能找到适合自己操作的框架,学习前端如果有不懂得地方可以到小猿圈网站寻找答案,里面有专业的讲师团队还有优秀的助教老师,等你来学习。
th:text为null报错_小猿圈web前端之vue-cli项目打包完成后运行文件路径报错问题相关推荐
- web前端三大主流框架_小猿圈web前端之前端的主流框架都有哪些?
社会在不断发展,互联网更新换代也是飞速,web框架也是经历一代又一代的革新,那么当今时代什么框架是前端的主流框架呢?小猿圈web前端讲师查了一些资料,整理出当今时代比较流行的三种框架,下面说一下这三种 ...
- css怎么使元素绝对定位有过度效果_小猿圈web前端讲解div+css绝对定位和相对定位...
最近很多网友问我绝对定位和相对定位怎么区分,怎么使用?绝对是什么地方的绝对,相对又是相对于什么地方而言的呢?那他们又有什么样的特性,可以做出什么样的效果呢?关于两者之间又有什么样的技巧呢?下面小猿圈w ...
- vue 传参 微信_小猿圈web前端之微信小程序页面间跳转传参方式总结
原标题:小猿圈web前端之微信小程序页面间跳转传参方式总结 最近小程序发展的越来越快,很多大公司也在打造自己的小程序平台以及购物小程序等等,今天小猿圈web前端讲师就总结了关于微信小程序的知识点,首先 ...
- 小猿圈web前端之移动端Vue+Vant实现上传压缩旋转图片功能
小猿圈web前端讲师为了大家更好的学习前端知识决定每天分享一个web前端案例,希望对你与学习前端的你有所帮助,今天分享的是移动端Vue+Vant的Uploader实现上传.压缩.旋转图片等功能的详细介 ...
- 小猿圈web前端简述canvas如何实现二维码和图片合成
你经常看到活动海报什么的,上都是有各种宣传文案以及二维码形成的,你知道怎么用canvas实现二维码和图片合成,下面小猿圈Linux讲师为你详细介绍一下canvas如何实现二维码和图片合成的. 使用ur ...
- 小猿圈web前端讲解dl、dt、dd标签
于web前端工作者以及正在学习前端的同学来说dl.dt.dd标签一定不陌生的,今天小猿圈web前端讲师就给大家讲解一下dl.dt.dd标签用途等问题. dd.dt标签是是列表用的. 我们平时常用的是& ...
- 小猿圈web前端之jQuery抽奖系统
你有没有想过有一天可以成为千万富翁呢?你是通过自己的努力和奋斗还是其他手段获得的呢?前端程序员是通过jQuery获得的,他自己写了一个抽奖系统,下面就小猿圈前端讲师分享给大家. 效果图: <!D ...
- 小猿圈Web前端开发学习路线
很多人已经下定决心学习前端开发,但是学习很盲目,没有一个明确的目标,导致学了很长时间效果也没有很明显,最终放弃了,这个结果是我们最不想看到的结果,那么学习路线就十分重要了,好的学习路线对学习会引向成功 ...
- 前端 input怎么显示null_小猿圈WEB前端之HTML5+CSS3面试题(一)
学习是一件非常充实的过程,特别是把自己的乐趣变成工作的时候,很多朋友就喜欢学习web前端,所以学习前端,也希望从事前端的工作,但是因为缺少实战经验,所以很多都是卡在面试这关上,下面小猿圈总结了web前 ...
最新文章
- Windows Server应用之32位系统如何安装64位打印机驱动
- 即时通讯软件设计(一)
- 如何攻击Java Web应用【转载】
- 初学Java会遇见的几个问题分享
- js打开本地文件夹_vue + ArcGIS 地图应用系列一:arcgis api本地部署(开发环境)
- zedboard linux内核下载,zedboard学习-为Linux内核打补丁
- linux ssh免密码登录设置
- Spring IOC整理
- 计算机取证之你必须要会用的24款工具
- 【网络流24题】魔术球
- python调用通达信函数用户指标_通达信自定义指标调用
- 遥感图像处理学习一、概念及组成
- ass字幕转换成文本文件
- STM32嵌入式基础开发07-使用PS2手柄遥控麦克纳姆轮小车(7_PS2_Veh)
- 我如何学会欣赏求职者
- 学C语言的大佬们帮帮小弟吧小弟感激不尽
- android厨房的使用方法,懒人生活的福音:Android在厨房_软件资讯技巧应用-中关村在线...
- 使用Quantlib,通过YTM计算债券净值
- java8/日期时间
- VR教程来了!谷歌设计师出品的VR设计入门指南
热门文章
- Java中List高效去重
- 利用Visual Studio的搜索功能和正则表达式统计代码行数
- SpringMVC返回Map类型转换成JSON失败
- id 的选择器为什么要这么写 li#first?
- 你的.net 2.0 真的能与1.1 安全正确地运行在同一台电脑上吗? 小心Server Application Unavailable 错误...
- 122网络各层中的设备是什么以及工作原理
- 使用Tensorflow构建和训练自己的CNN来做简单的验证码识别
- linux基础试卷笔试,顽石系列:Linux基础笔试
- oracle dbms lob,如何使用DBMS_LOB从文件中加载CLOB数据
- 006_JSONObject对象公共方法