vue打包--error:enoent:no such file or directory,open....报-4058问题

原创已于 2024-03-17 17:42:20 修改 · 3.3k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#npm #前端 #node.js

于 2023-04-02 09:48:25 首次发布

项目场景：

vue打包--error:enoent:no such file or directory,open....报-4058问题

没有此类文件或文件已经损坏

问题描述

没有此类文件或文件已经损坏

原因分析：

问题产生原因：没有生成相应的hash值，我的webpack配置有问题，问题就出在ExtractTextPlugin这里

解决方案：

问题解决过程：npm run build 完后，报以上错误，查看了dist文件目录，点开css文件目录里面没有生成相应的 .css文件，css文件目录下为空

问题解决

问题解决：修改为以下代码，就解决了

new ExtractTextPlugin({
      filename: utils.assetsPath('css/[name].[chunkhash].css'),
      // Setting the following option to `false` will not extract CSS from codesplit chunks.
      // Their CSS will instead be inserted dynamically with style-loader when the codesplit chunk has been loaded by webpack.
      // It's currently set to `true` because we are seeing that sourcemaps are included in the codesplit bundle as well when it's `false`,
      // increasing file size: https://github.com/vuejs-templates/webpack/issues/1110
      allChunks: true,
    }),

ENOENT: no such file or directory 错误通常表示 Node.js 尝试打开一个文件或目录，但是没有找到它。当你在 Vue 项目中遇到这个错误时，这可能是由于多种原因造成的。以下是一些解决此错误的步骤：

检查文件路径：
- 确保你尝试访问的文件或目录的路径是正确的。
- 如果你使用的是相对路径，请确保它是基于当前执行命令的目录。
检查 publicPath：
- 如果你在构建 Vue 项目时使用了 webpack 或其他构建工具，并且指定了 publicPath，请确保它指向正确的路径。
检查依赖项：
- 运行 npm install 或 yarn install 来确保所有的依赖项都已正确安装。
- 有时候，某些依赖项可能未能正确安装，导致构建过程中找不到必要的文件或模块。
清除缓存：
- 尝试清除 npm 或 yarn 的缓存，并重新安装依赖项。
- 对于 npm，可以使用 npm cache clean --force。
- 对于 yarn，可以使用 yarn cache clean。
检查 .gitignore 或其他忽略文件：
- 确保你没有在 .gitignore 或其他版本控制忽略文件中不小心包含了需要构建的文件或目录。
检查构建脚本：
- 查看 package.json 中的 scripts 部分，确保构建脚本（如 build）配置正确。
检查文件权限：
- 确保你有足够的权限去读取和写入构建过程中涉及的文件和目录。
查看完整的错误输出：
- 通常，ENOENT 错误后面会跟着一个具体的文件或目录路径。检查这个路径，并尝试手动查找它，看看是否真的存在。
检查第三方插件或加载器：
- 如果你在 webpack 配置中使用了第三方插件或加载器，请确保它们都是最新的，并且配置正确。
搜索项目中的引用：
- 使用文本编辑器或 IDE 的搜索功能，在整个项目中搜索引发错误的文件名或路径，看看是否有地方错误地引用了它。