关于angular-cli build后文件路径错误

最新推荐文章于 2025-05-09 11:02:46 发布
最新推荐文章于 2025-05-09 11:02:46 发布
阅读量908 收藏 1
点赞数
CC 4.0 BY-SA版权
分类专栏： AngularJS Webpack angular-cli
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/ho_mx/article/details/69943670
本文解决Angular项目使用angular-cli构建后，在Tomcat部署时资源路径错误的问题。通过在package.json的scripts中添加特定参数来修正路径。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

在angular-cli执行ng build --prod --aot后部署上tomcat后发现资源获取路径错误，



google一遍，提示在packge.json的scripts添加"build":"ng build --prod --aot --base-href ./"

其中./是自定义路径，一般为我设置为项目路径

嗯，按照这段指令，可以直接ng build的时候加上--base-href ./ 即可

ok，正常上线

Ionic报错Error: Cannot find module ‘@ionic/angular-toolkit‘的版本兼容性解决方案
shejizuopin的博客
05-28 1071
摘要（150字）： 本文针对Ionic开发中的Cannot find module '@ionic/angular-toolkit'错误，分析了三种常见原因：模块未正确安装、版本不兼容和项目配置错误。提供了详细的解决方案矩阵，包括检查模块安装情况、重新安装模块、指定兼容版本、配置包源等步骤，并附有版本兼容性表格和常见问题解答。通过系统性排查安装、版本和配置问题，结合清理缓存和更新CLI工具等措施，可有效解决该错误。建议开发者参考Ionic官方文档和社区实践，确保模块版本与项目兼容。
基于vue-cli搭建多模块且各模块独立打包的项目
weixin_33690963的博客
04-24 6929
github地址 https://github.com/shuidian/v...为了充分发扬拿来主义的原则，先放出github地址，clone下来即可测试运行效果。如果觉得还可以的话，请点star，为更多人提供方便。 背景 在实际的开发过程中，单页应用并不能满足所有的场景。传统单页应用所生成的成果物，在单个系统功能拆分和多个系统灵活组装...
《Angular之ng build部署后base文件路径问题》
杨晓风 迷迭香的记忆
09-30 7263
前言：                                                             千锤万凿出深山，烈火焚烧若等闲。 正文：    一。问题描述         使用angular-cli搭建的项目，执行ng build后，浏览器打开空白，界面显示一直loading.    二。问题定位         文件路径不对，使用ng new...
angular 打包后资源访问出错
weixin_60592115的博客
03-21 280
多在打好的资源包尝试修改html文件的资源路径。
实现文件图片上传下载的完整指南
weixin_35754962的博客
05-09 775
懒加载是一种网页性能优化技术，它允许页面只加载可视区域内的资源，而将不可见的资源延迟加载。这种技术对于提高初始页面加载速度非常有效，因为它减少了页面加载时的总数据量。对于图片密集型的页面，比如图库、相册、内容丰富的文章等，懒加载特别有用。懒加载之所以能提高性能，是因为它将页面分为两部分：可视区域（用户当前能看到的）和非可视区域（用户目前看不到的）。浏览器优先加载可视区域内的资源，非可视区域内的资源则在用户滚动页面到那些区域时再加载。这种方式减轻了服务器的负载，减少了数据传输量，加快了页面的渲染速度。
angularjs cli执行ng build命令文件路径错误解决
“明明很开心”的博客空间
04-24 569
angularjs cli执行ng build命令打包文件时，加载的所有js路径错误， 执行使用命令 ng build --base-href ./ 即可解决问题
详解如何构建Angular项目目录结构
08-30
本篇文章主要介绍了详解如何构建Angular项目目录结构，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
Angular：解决项目打包发布后，前端静态图片在测试环境无法显示的问题
灿灿大王搭建的黄金屋
06-27 5295
今天前端页面的一些静态图片显示出现了一些问题，之前我让图片在测试环境显示的方法都是直接在Xshell上将本地图片直接上传到服务器，参考我之前的blog：https://blog.csdn.net/qq_36451496/article/details/91798366 今天后端小哥说，实际上前端的一些静态图是可以直接打包发布的，不用预先存到服务器上，所以就把服务器中存图片的assets文件夹备份...
详解Angular-Cli中引用第三方库
08-30
在配置`angular-cli.json`时，有时可能会遇到路径错误导致编译失败。错误信息通常会指出是因为找不到某个模块。这是由于路径配置错误导致webpack无法正确地找到`node_modules`目录下的资源。需要确保配置的是相对于...
基于vue-cli(vue2.X，webpack1.X，es6，sass环境)多页面开发.zip
12-02
cli(2.0) 多页面开发实战由于之前主要使用jquery方式开发，现在想换一种方式，使用MVVM开发（感觉vue操作之前用的angular1.X差不多类似），所以在开发中会遇到很多问题，直观来记录一下或者还有很多不足，或者里面...
File was processed with these loaders: * ./node_modules/@angular-devkit/build-angular/node_modules/less-loader/dist/cjs.js You may need an additional loader to handle the result of these loaders.
最新发布
06-14
如果没有，请安装：```bashnpminstalllessless-loader--save-dev```2.**配置`angular.json`文件**：在Angular项目的`angular.json`文件中，我们需要确保样式预处理选项正确设置，并且AngularCLI能够处理LESS文件。...
angular2 ng build部署后base文件路径问题详细解答
08-29
本篇文章主要介绍了angular2 ng build部署后base文件路径问题详细解答，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
【angular2】（3）ng build部署后base文件路径问题
热门推荐
Pluto
02-18 1万+
问题：使用angular-cli搭建的项目，执行ng build后，浏览器打开空白，发现文件的路径不对解决方案： 在package.json文件的scripts中添加命令："build":"ng build --base-href ./" –base-href后面替换成打包后的base路径 执行：npm run build
Angular ng-build后放入Tomcat,刷新404，手动输入404
feishusang的博客
03-27 3118
最近因为一些要求，需要将angular打包放入tomcat和后台丢入同一个地址下，发布后，访问网站，过程都正常，单当刷新网页的时候，就出现404页面同样，如果这个路由是你手动输入到浏览器的，也会跳转到404页面。产生这样的原因，经过查资料也能发现，因为刷新页面、手动输入跳转寻找的都是 java web中的地址，自然是找不到的。通过查询，看到的解决办法大致是两种：1、在NgModule中添加：   ...
angular打包后路由和文件路径不对
weixin_30553065的博客
03-19 748
base href换成如下script标签 <!-- <base href="/"> --> <script> document.write('<base href="' + document.location + '" />'); </script> 在app.module.ts下添加 { prov...
Javaweb+Angular项目避免打包后找不到静态资源文件的措施
oneloser的博客
06-02 2667
Javaweb+Angular项目避免打包后找不到静态资源文件的措施 1、前端创建的angular项目的名称应该和后端创建的java项目的名称保持一致； 2、package.json中的build需要通过–base-href来指定静态资源的路径，具体如下： "build": "ng build --base-href ./", //开发环境 "build:prod": "ng build --pr...
Angular11(Cli) 在打包 ng build 后的常见问题处理方案
沐枫
04-21 1万+
前言： 我自认为，到目前为止 Angular 框架始终保持着前端框架领域中的龙头老大位置，虽然在前端框架领域中有很出色的React.js和易上手的Vue.js框架。 从使用以上3个框架的情况来看，我个人更喜欢Angular，尤其是在支持使用TyptScript以后，当然React和Vue都有，而且各个框架都有自己的特色，所以在选择时要根据项目大小、需求等方面来选择合适的前端框架，这里就不多说了...
angular ng build打包后路径错误导致页面404
kikyou_csdn的博客
09-04 2868
错误： ` Failed to load resource: net::ERR_FILE_NOT_FOUND ` 解决： 打包时在ng build后加上--base-href ./
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值