问题标签 [webpack-5]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
node.js - 未找到模块:错误:无法解析“fs、net、path、util、os ...”
与 webpack 捆绑时出现以下错误。
我是按照错误描述的方法设置的,但是不知道是哪里出了问题。
- 快递/阿波罗服务器/ webpack5
错误
共 42 个重复错误。
webpack.config.js
完成设置 'node{ooo:"empty"} 和 'resolve fallback'。
包.json
javascript - Webpack 5.3.1 TypeError:Object.getOwnPropertyDescriptors 不是函数
我正在尝试覆盖 IONIC 项目的 webpack.config.js。当我将 webpack 包含到 webpack.config.js 中时,它会出现错误。
Webpack 版本:5.1.3
angular - 为什么扁平化 ES 模块 (FESM) 比非扁平化 ES 模块 (ESM) 性能更高?
根据Angular Package Format 文档,Angular 包被分发为两种 ES 模块:
- 扁平化 ES 模块 (FESM),其中删除了导入语句并内联了导入的代码。
- 未扁平化的 ES 模块 (ESM),其中导入语句保持不变。
package.json 的module
值指向 FESM 版本。文件中说的原因是:
从 webpack v4 开始,webpack 用户不需要扁平化 ES 模块优化,实际上理论上我们应该能够在不扁平化 webpack 中的模块的情况下获得更好的代码拆分,但在实践中,使用 unflattened 时我们仍然会看到大小回归模块作为 webpack v4 的输入。这就是为什么“module”和“es2015”package.json 条目仍然指向 fesm 文件的原因。我们正在调查此问题,并希望在解决大小回归问题后将“module”和“es2015”package.json 入口点切换到未展平的文件。
为什么未展平的模块会看到尺寸回归而展平的模块没有?
webpack - Webpack 5 并支持 UNC 路径作为输出?
如果我将output.path
webpack 配置的属性设置为 UNC 路径,就像\\COMPUTER-NAME\some-share
我从 webpack 5 开始得到以下错误(它曾经在 webpack 4 中工作):
我查看了 join 方法,如果node_modules\webpack\lib\util\fs.js:121:9
它看起来像:
从我在这里可以看出,如果输入 fs 没有连接方法,则 UNC 路径将不起作用。
我不确定输入 fs 参数是什么。我在 Windows 系统上测试这个,我猜这个功能不存在......
应该支持 UNC 路径吗?
angular - 如何在 IIS 上使用 webpack5 模块联合部署 Angular 应用程序?
我正在尝试在 IIS 上部署一个使用 webpack5 模块联合的应用程序,该模块联合使用 ngx-build-plus 自定义构建器和angular.json 中定义的extraWebpackConfig文件构建。该应用程序开始正常加载并获得了网站图标,但随后导致错误:
如何在 IIS 上成功部署应用程序?
javascript - 为什么我保存更改时“webpack serve”命令不刷新 html 页面?
Windows 10x64、Node.js v14.15.1、npm v6.14.8、谷歌浏览器 v87.0.4280.141
为什么当我使用命令时,当我更改文件并保存更改npm start
时它不会刷新网页?src/index.js
当我保存更改时,我看到它会重建项目,但它不会刷新网页,我F5
每次都要手动按键。这是我的简单项目:
包.json:
webpack.config.js:
src/index.js:
我做错了什么?
javascript - Webpack 加载包但不执行代码
我正在使用 django 加载 webpack 块,并且我有一些入口点。问题是我有一个包含所有 node_modules 包的供应商块,并且该应用程序在几乎所有入口点都可以正常工作。但是有几个入口点不需要加载供应商块,如果我不添加供应商块,则入口点文件会加载到浏览器中,但不会执行代码。如果我使用入口点加载供应商块,则可以。
例如我有这个入口点:
注册的内容基本上是一个console.log(),它需要一个样式表
并且入口点像这样加载到模板中
我也在 webpack 配置中创建供应商包,如下所示:
当我在浏览器中加载页面时,它没有加载样式,也没有在入口点块内执行 console.log,但我可以看到注册块代码
我也一直在做一些测试,我意识到如果我在模板中加载块供应商也可以正常工作,如下所示:
任何人都知道为什么会发生这种情况?我不需要此模板中的供应商捆绑包,但 webpack 强制我添加它
我正在使用 webpack 5.18.0
谢谢您的帮助!
mini-css-extract-plugin - 如何让 mini-css-extract-plugin 与 webpack 5 一起工作?
我正在尝试提取库中的 css 文件。我已经阅读了使用 mini-css-extract-plugin 的方法。
难道我做错了什么?还有另一种方法可以为我的库提取 css 文件吗?
下面我使用https://webpack.js.org/plugins/mini-css-extract-plugin上提供的相同文件创建了一个简单的测试项目
下面的示例在 webpack 5 中失败,但在 webpack 4 中运行良好。
样式.css
index.js
包.json
webpack.config.js
错误
vue.js - Vue 3 渲染子组件的子组件的问题
我使用and创建了一个Vue 3.0.5
应用程序。我构建了一个全局组件my-component.js:Webpack 5.21.2
Webpack CLI 4.5.0
导入的second-component.vue:
第三个组件third-component.vue:
以下是 webpack 配置webpack.config.js:
我在index.html中使用的捆绑文件如下:
我得到的问题是子组件的子组件没有渲染。就我而言,这是我要导入到second-component.vue中的组件third- component.vue 。但是,当我将组件third-component.vue直接用于my-component.js时,它可以工作。有人可以解释为什么以及如何解决这个问题吗?这里我有一个代码框。
javascript - 如何在构建时获取 webpack 版本
在执行 webpack 构建期间,我想获取 webpack 版本。我需要这些信息来基于 webpack 4 或 webpack 5 进行构建准备。
意图:为项目从 webpack 4 升级到 5 做准备,我不允许自己执行此特定步骤。在某些时候,公司构建运行器会更新 webpack。
我知道 webpack 有一个命令:npx webpack --version
. 如何从构建配置中访问版本?