webpack build 在windows和Linux下build需注意路径的大小写

最新推荐文章于 2025-02-12 13:43:23 发布
最新推荐文章于 2025-02-12 13:43:23 发布
阅读量3.2k 收藏 2
点赞数 1
CC 4.0 BY-SA版权
分类专栏： Webpack VUE
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/u011350541/article/details/84034952
本文讨论了在不同操作系统中，如Windows和Linux下，如何正确配置前端路由以避免因路径大小写敏感导致的错误。强调了在index.js中路径配置的一致性和准确性对于跨平台构建的重要性。

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

如：route/index.js
实际路径：/page/WanHG/index.vue

在index.js中写法

const ImageList = () => import('/page/Admin/imgaeList.vue')
const WanHgIndex = () => import('/page/WanhG/index.vue'

在Windows内进行build不会报错，因为Windows忽略路径的大小写。但是Linux下会报错，提示无法找到文件。

因此在配置路由时，一定要保证index.js中与路径写法一模一样

构建Web应用程序：使用Webpack和Webpack插件进行功能扩展和优化
AI天才研究院
06-27 4092
随着互联网的发展，Web应用程序变得越来越流行。Web应用程序需要快速构建、高效运行和提供出色的用户体验。为了实现这些目标，我们需要使用各种技术和工具来优化Web应用程序。Webpack是一个流行的JavaScript构建工具，它可以满足我们的大部分需求。2.2.1. 算法原理Webpack的算法原理是基于ES6模块的。Webpack会分析每个模块的依赖关系，并生成唯一的文件路径。通过这种方式，Webpack可以生成高效的静态资源。2.2.2. 操作步骤安装Webpack配置Webpack。
手写一个webpack插件（plugin）
小小•愿望的博客
05-30 2215
在使用webpack的时候，我们有时候需要在 webpack 构建流程中引入自定义的行为，这个时候就可以在 hooks 钩子中添加自己的方法。
web项目linux编译路径,webpack下，项目打包再window下和linux下对路径大小写法处理不一样...
weixin_29384119的博客
05-03 366
上周，在项目部署的时候出现一个页面css样式不正确，但是在本地开发过程中显示是正常的，但是在使用Jenkins自动编译打包部署时，页面布局显示错乱。分析过程：1、一开始以为地Jenkins打包编译的脚本代码有问题，经过排查是正常的。2、本地开发正常，打包版本不正常，分析可能是编译后css的优先级被改变，导致样式被覆盖。但是本地直接build，然后使用ngnix部署，发现样式是正常的。因此排除是样式...
case-sensitive-paths-webpack-plugin:强制Webpack要求区分大小写的路径
05-09
区分大小写的路径-Webpack插件 该Webpack插件将强制所有必需模块的整个路径与磁盘上实际路径的确切情况相匹配。 使用此插件有助于缓解OSX上的开发人员不遵循严格的路径区分大小写的情况，这些情况将导致与其他开发人员或运行其他操作系统（需要正确使用大小写正确的路径）的构建盒发生冲突。 基于相同想法的为该插件提供了基础，但不幸的是，没有正确检查整个路径上的大小写。 该插件可以解决该问题。 输出示例： 找不到./src/containers/SearchProducts.js模块中的错误：错误：[CaseSensitivePathsPlugin] /Users/example/yourproject/src/components/searchProducts/searchproducts.js与磁盘/Users/example/yourproject/src/components/
大小写敏感吗_使用 webpack 插件规范文件的大小写
weixin_39525617的博客
12-24 994
此文对应 Issue Blog： https://github.com/zhangwilling/blog/issues/15 有更好的 MarkDown 观看体验。知乎的 MarkDown 还是那么挫。背景运维同学对文件的大小写问题一定很有感触。Mac 上大小写默认是不敏感的，到了线上（一般是 Linux）又是不敏感的，这就导致了一些莫名其妙的问题。从前都是口头约定，但不是所有人都会遵守。为了...
VUE使用Webpack打包路径问题
weixin_34388207的博客
12-13 347
使用Webpack进行项目打包，容易出现引用资源路径错误问题。总结一下 一、webpack打包指令 npm run build 二、webpack打包后生成dist文件,将dist文件夹中的文件，放在服务器上 1、如果页面空白，报错资源的引用路径不对 解决：找到 config > index.js build: { inde...
关于webpack
GuoZebin的博客
06-10 453
在去年刚接触到vue时，也同时接触到了webpack这个打包工具，在官网上和各种博客上也学习了它的各种概念，类似loader和plugin和区别呀，自己手写一个loader啊等等各种，但从未在实战中研究过，而且因为从自从vue-cli升级到3以后，已经不再暴露webpack的配置文件，所以对webpack的实战使用十分有限。最近开始重构去年初学react时写的一个项目，在给ant-design更换...
npm start 报错：文件大小写不区分导致报错或者警告
轻风细雨_林木木
02-24 2019
这里是说文件大小写没有区分，因为Linux下是严格区分大小写，所以这里只需要修改项目文件的name不要是大写就好。
webpack安装成功后的run build填坑之旅
Youga123的专栏
07-03 1511
目录索引 首先，到package.json文件中查看依赖引用： 我们安装的cli和webpack已经被引用到配置文件中，接下来，执行下面的命令测试我们安装好的webpack是否能用 npm run dev 报错截图： 到package.json中查看，script中确实没有dev，查找资料，说全局安装webpack即可解决，先全局安装cli，再全局安装webpack： sudo npm in...
linux打包前端项目文件路径大小写问题
最新发布
03-14
好的，我现在需要解决用户在Linux环境下打包前端项目时遇到的路径大小写敏感问题。首先，用户提到的问题可能出现在Vue或其他前端项目中，比如引用的组件或文件路径的大小写与实际文件名不一致，导致在Linux系统上找...
Webpack
酷爱前端的小陈博客
04-15 579
1. webpack 中的插件 1.1.什么是 webpack 概念：webpack 是前端项目工程化的具体解决方案。 主要功能：它提供了友好的前端模块化开发支持，以及代码压缩混淆、处理浏览器端 JavaScript 的兼容性、性能优化等强大的功能。 好处：让程序员把工作的重心放到具体功能的实现上，提高了前端开发效率和项目的可维护性。 注意：目前Vue，React 等前端项目，基本上都是基于webpack 进行工程化开发的。 1.2. 创建列表隔行变色项目 ① 新建项目空白目录，并运行n...
webpack打包配置禁止html标签全部转为小写
weixin_30527551的博客
08-08 203
用webpack打包页面，发现html中特别写的用来给后端识别的大写标签全部被转为了小写标签，这时候需要将加一个配置 ，caseSensitive:true ，禁止大小写转换。 webpack配置： { test: /\.html$/, use: [ { ...
Linux环境下对大小写敏感，linux环境升级node
weixin_30408739的博客
06-14 480
linux对大小写敏感 在window下可以正常运行的代码，在linux环境下报错，找不到文件，因为window下对大小写不敏感，linux对大小写敏感 linux环境下node升级 1.安装nvm curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33. 2.安装完后，如果是用xshell连远程主机的话，先...
webpack打包 模块名称大小写更改
A873054267的博客
11-25 903
某些项目类库和ui工程在一块儿，长江的类库名称为小写，但类库模块名称为大写 导致引用错误 js文件配置 css配置，需要注意的是MiniCssExtractPlugin低版本不支持函数传入 最新版本打包会有weakmap的报错，我试了一个1.2.1的版本可以兼容 ...
linux对当前路径打包,webpack下，项目打包再window下和linux下对路径大小写法处理不一样...
weixin_39628945的博客
05-02 378
上周，在项目部署的时候出现一个页面css样式不正确，但是在本地开发过程中显示是正常的，但是在使用Jenkins自动编译打包部署时，页面布局显示错乱。分析过程：1、一开始以为地Jenkins打包编译的脚本代码有问题，经过排查是正常的。2、本地开发正常，打包版本不正常，分析可能是编译后css的优先级被改变，导致样式被覆盖。但是本地直接build，然后使用ngnix部署，发现样式是正常的。因此排除是样式...
Webpack包
Hello World！
02-12 1567
webpack包的简单使用、插件（生产HTML文件、提取CSS代码、压缩CSS代码、前端注入环境变量）、加载器（打包css文件、打包less文件）、内置模块（打包图片字体等、开发环境调错、解析别名、CDN相关配置、分割公共代码）、其他包（bootstrap、axios、热更新代码包、环境变量设置包）、多页面打包、一些注意事项、webpack.config.js完整代码、1个待解决问题（为什么一定要引入bootstrap.js文件）
vue项目打包在Linux系统报错
weixin_48258311的博客
03-12 1125
之前在Windows系统下打包的vue项目一切正常，后来在Linux系统下打包就报错，显示找不到文件，后来发现是在路由引入的过程中大小写和文件名不一样，比如文件名是index,但是在使用的过程中写成了Index，这种情况在windows 环境下是没有问题的，但是Linux环境下，大小写敏感，就会报错。
【vue打包路径敏感解决】linux下vue打包路径大小写敏感问题分析解决
weixin_45974445的博客
12-30 2918
vue在linux下打包路径大小写敏感，问题解决 window下文件的路i的大小写是不敏感的，而linux下文件的路径名称需要区分大小写，在用linux打包文vue项目的时候会出现路径错误。要在linux 下完成打包，需修改文件中路径引用严格区分大小写。 此处通过python 脚本对 route/index.js 路径进行修改获取正确路径 # -*- coding:utf-8 -*- ''' Description: Author: xiaoming Date: 2021-12-30 15:22:01 '
vue 使用webpack打包，出现路径404 ，导致白屏&webpack-bundle-analyzer使用
zoepriselife316的博客
11-17 1280
webpack-bundle-analyzer
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值