问题标签 [extracttextwebpackplugin]

我正在使用WEBPACKEXTRACT-PLUGIN提取scss到css文件中。

有条件提取有问题。目前我们有OLD-SCSS和NEW-SCSS，所以在我的app.js文件中就是这样。

但最终结果是OLD-SCSS和NEW-SCSS的组合，无论条件是true还是false。

有没有办法让它有条件地提取。

我正在尝试使用extract-text-webpack-plugin生成捆绑的 css 文件并使其按顺序生成。

现在，生成了 CSS 文件，但“ignoreOrder”似乎不起作用，内容的顺序不符合源代码的顺序。

我的 js 导入了一些 scss 和 js。

• 网络包版本：3.5.5
• 提取文本 webpack 插件版本：3.10.10

我正在尝试在充当代理 (proxyPass) 的 Apache vhost 后面设置一个 Web 应用程序，以添加 contextPath。当然，只有虚拟主机必须知道这个 contextPath。

一切都很好，除了未加载的背景图像。原因很简单：

SASS 图像 URL 是绝对的，不包含 contextPath。

如果最终 CSS 中生成的 URL 是相对的，则应该正确加载图像。

那么如何使用 SASS/Webpack 生成相对路径呢？

笔记：

无论我在 SASS 文件中使用的是绝对路径还是相对路径，最终输出始终是绝对的。我目前使用：

• 网络包 3
• 节点萨斯 4.5.3
• 萨斯加载器 6.0.6
• 提取文本 webpack 插件 3.0.0

我不使用任何文件加载器（我也尝试过，但什么也没做），只是复制 dist 目录中的所有图像。

我希望能够import在我的反应应用程序中不仅用于 js/jsx 文件，还可以用于 css 文件。根据我的阅读，最好的方法是使用extract-text-webpack-plugin将导入的 css 文件并将它们捆绑在一起。

我已经对其进行了设置，以便它生成我捆绑的 css 文件，但由于某种原因，每次我加载我的页面时都会出现语法错误：

我的设置如下所示：

webpack.config.js

入口点./views/Index.js是我要导入我的 css 文件的地方：

索引.js

在导入的./Layout.jsx文件中，我使用 a<link>在我的页面中包含捆绑的 css 文件：

布局.jsx

我很困惑，因为看起来我的应用程序构建良好，但是当我尝试访问我的网页时，我不断收到语法错误。

谁能帮我理解我做错了什么？

我有一个src/styles/main.scss文件，我想将其转换为build/styles/main.css然后在index.html中使用它。

我一直在尝试使用文本提取器插件设置 webpack，但无法达到最终结果。

这是我的目录结构：

webpack.config.js

我正在使用 Webpack 编译 Sass，而 PostCSS 自动前缀无法处理导入到style.scss入口点的部分。

将样式直接添加到style.scss按预期添加前缀，但任何引用为 an 的文件@import都不会自动添加前缀。

我在下面添加了 webpack.config、postcss.config 和 style.scss 供参考。

webpack.config.js

postcss.config.js

样式.scss

是否有我缺少的特殊加载程序或语法让@import文件自动添加前缀？

* 编辑 *

我可以通过调整 scss 加载程序的顺序来解决这个问题。

我想创建将 js 和 css 保存在同一个文件夹中的 React 组件（对于每个组件）：

• 对话
  • 容器.jsx
  • 演示文稿.jsx
  • 样式.less

这是我的 webpack 配置的一部分：

Webpack 创建bundle.js+bundle.css文件。我会说它按预期工作，除了片刻。我发现其中bundle.js包含来自bundle.css.

例如，如果大小bundle.css为 50KB，则bundle.js= 自己的大小 + 50KB。

我的 js 包中不需要重复的 CSS 代码。那么如何解决呢？

我的 webpack 配置有问题。它运行没有错误，但不输出除 app.js 和 index.html 之外的任何文件。应用遗传样式。唯一不起作用的是字体

webpack 版本 ^3.5.6 extractTest 版本 ^3.0.0

文件夹结构：

在config.less我想存储一些变量。在Test/styles.less我需要包括config.less：

编译器返回此错误：

@import 'config.less';
^
无法解析 './config.less'

（注意：它尝试加载./config.less而不是config.less）

这包括作品：

但这非常不方便。这是我的 webpack 配置：

似乎 resolve.modules 配置在这种情况下不起作用。（我也尝试使用 webpack 的 resolveLoader 设置）

我在使用extract-text-webpack-pluginWebpack 3 将样式表标签放置在正确位置时遇到了一些问题。

我的项目使用从 CDN 提取的第三方样式表以及本地样式表包。我希望第三方样式覆盖我的本地包，但提取文本插件将本地样式标记放在最后。这是一个问题，因为本地包包含破坏第三方组件的重置。

我的 index.html 模板看起来像这样（释义）：

这是生成的标记：

我在文档中搜索extract-text-webpack-pluginand html-webpack-plugin，但一无所获。有谁知道如何用第三方样式覆盖我的本地样式？

对于更多背景知识，我的 CSS 配置如下所示：

我也在使用 HtmlWebpackPlugin：