问题标签 [survivejs]

我一直在尝试许多不同的配置，但我现在觉得我已经盯着这个问题太久了，无法再弄清楚了。我正在尝试将 webpackfile-loader用于简单的图像，而正常的配置在开发中就像一个魅力，每当我npm run start使用 SSR 运行时，我都会遇到标题中提到的错误。要在此处提供更多信息，请参考我的 webpack 配置中的规则：

这是我的依赖项：

只是为了完成，我的public文件夹的结构是这样public/js的public/images，并且 webpack 正确地输出了这个文件夹中的图像。我觉得我在某处犯了分心错误，所以如果您需要任何其他信息来帮助我解决这个问题，请告诉我。这是一个全新的设置，因此每个包都是最新版本。

编辑

我实际上注意到，除非我webpack -p先运行（它会创建public/images包含使用过的图像的文件夹），否则在开发模式下控制台告诉我它找不到任何图像，开发构建不会抛出任何错误，但是有一些问题路径，如果我不指定任何路径，我只能使其工作。在生产中，此配置“有效”，但Unexpected character出现错误。

我在webpack.validateSchema is not a function设置 webpack 并在下面做出反应时遇到了这个问题，我分享了我的webpack.config.js

我开始使用 Webpack

我安装了 webpack@4.17.1

我得到它生成组装的 js & css 文件，并移动 img 文件

当我运行 webpack 我得到

现在我想生成一个 manifest.json

我安装了 webpack-manifest-plugin@2.0.3

我配置了

现在，当我运行 webpack 时，添加了 manifest.json

对于这些文件，会生成 manifest.json

我不明白为什么“*.img”文件的清单键有“img/”前缀，但“*.js”和“*.css”键没有。

我想得到一些一致的东西，比如

我想它需要不同的配置。

还不知道该怎么做。

我需要在配置中添加或更改什么？

感谢任何帮助！

编辑1：

在以下选择中是否存在块大小/加载时间影响：

• 将客户端应用程序拆分为多个捆绑包并跨不同的 html 页面提供服务（即服务器端路由/about => about.html => about.bundle.js等）（这并不意味着代码拆分仍不能用于子页面，例如 admin/dashboard、admin/reports） .

• 为单个客户端应用程序提供服务，该应用程序使用跨客户端路由的代码拆分。

并且块大小/加载时间的重要性很可能会因架构考虑而黯然失色，例如：

• 跨不同路径共享/隔离状态的需要/愿望

• 抽象应用程序初始化代码的开销，以便它可以在每个包中运行，而不是优化每个应用程序包的初始化代码。

?

一般来说，您为什么会选择一种方法而不是另一种方法？

注意：survivaljs等许多资源都讨论了捆绑拆分和代码拆分，称前者是后者的粒度较小的版本。但是，与仅使用代码拆分相比，何时可能需要拆分捆绑包尚不清楚，尤其是当您有可能将这些捆绑包拆分到不同的 html 页面时。

我目前正在使用带有 miniCssExtractPlugin 的 css 模块，它已连接它不工作，它确实将 css 提取到一个单独的 css 文件中，但 css 文件是空的。当我使用 style-loader 时，它与 css 模块看起来不错，但它会不要将 css 提取到单独的文件中。

但是当我尝试在生产模式下使用 miniCssExtractPlugin 时，生成的 css 文件为空。代码如下：

我也尝试将 style-loader 与 ExtractTextPlugin 一起使用，仍然无法正常工作，谁能告诉我如何解决这个问题？我会把我所有的 webpack.config.json 放在这里供你参考。

生产模式不起作用，MiniCssExtract生成的css是空的，有人可以帮忙吗？

大家好，我正在使用webpack-cdn-plugin从 CDN 加载资产，但我在加载 CSS 资产时遇到了问题。这就是我的代码的样子：

阅读应该在头脑中生成的文档<link rel="stylesheet" href="https://unpkg.com/flickity@2/dist/flickity.min.css">，但事实并非如此。Flickity 包在 dist 文件夹中有 CSS 和 JS 文件。我也尝试过添加

但这只会生成另一个script链接。有谁知道如何使它工作？

我正在尝试将项目更新到 Webpack 5。mini-css-extract-plugin导致错误。当我使用style-loader而不是 mini-css-extract-plugin 的加载器时，我的项目构建得很好。但是，您不应该将 CSS 内联用于生产构建。

这是我的 package.json 文件的一部分，其中包含相关模块。

这是我处理 SCSS 和 CSS 文件的 webpack 配置。

这是我得到的错误的一个例子。我的项目中的每个样式表文件都失败了。数百个错误（这是一个大项目）。

这是有问题的 scss 文件。

任何帮助，将不胜感激。我正在关注“SurviveJS - Webpack 5”一书，并将该书的课程应用到我现有的项目中，并完全重新做我的 webpack 配置以匹配这本书。

我是 webpack 的新手，目前正在尝试理解基本概念。查看官方文档，在概念页面上，它使用模块术语并提供链接以阅读有关模块页面上的模块的更多信息。

所以在这个页面上，我们有“什么是模块”的问题，但没有给出明确的答案。相反，它通过它们如何“表达它们的依赖关系”来描述模块：

什么是 webpack 模块

与 Node.js 模块相比，webpack 模块可以通过多种方式表达它们的依赖关系。几个例子是：

• 一个 ES2015 导入语句

• CommonJS require() 语句

• AMD 定义和要求语句

• css/sass/less 文件中的 @import 语句。

• 样式表 url(...) 或 HTML 文件中的图像 url。

所以它没有明确定义模块到底是什么，我现在很困惑。

模块只是一个javascript文件吗？还是任何类型的文件，例如 .css 或图像？还是模块是一些与物理文件完全无关的逻辑概念？