Webpack.config之前没有运行萨斯 - 装载机PostCSS-装载机

我的配置文件目前有以下可能相关的代码：Webpack.config之前没有运行萨斯 - 装载机PostCSS-装载机

{ 
    // do not exclude `node_modules` 
    test: /\.css$/, 
    loader: ExtractTextPlugin.extract(
     'style-loader', 
     'css', 
     { publicPath: '../' } 
    ) 
    }, 
    { 
    test: /\.scss$/, 
    exclude: /node_modules/, 
    loader: ExtractTextPlugin.extract(
     'style-loader', 
     ['css-loader', 'postcss-loader', 'sass-loader'], 
     { publicPath: '../' } 
    ) 
    },

，我第一次运行青菜装载机因为PostCSS装载机（Autoprefixer）是很重要无法访问我拥有的@mixin中的代码。

到目前为止，我已经无法给相关的供应商前缀适用于要导入的@mixin代码。一切正常，如果我移动@mixin码的地方，我@include这符合市场预期。

来源

2017-04-12 Elias Lee

装载机就像函数一样，这就是为什么它是从右到左。当你使用这个“style！css”时，想象它们就像函数：style（css（file））...在这种情况下，首先调用css。 – TGarrett

嗨，是的，我尝试了重新排序它们以及用'postLoaders'搞乱。我在webpack 1.14.0上。请让我知道你想要什么样的信息！我会尽我所能彻底。 –

阅读我更新的编辑。这应该会帮助你多一点。另外，先调用另一个的问题是什么？你的css和scss不应该有任何样式的问题，不管你真的使用什么顺序... – TGarrett

对于的WebPack 1提取物函数需要两个参数。

，当你不提取的CSS文件（后备）的第一个参数将被应用。

第二个参数是由一个感叹号(!)分离装载机的列表，这些装载机从右向左施加。

ExtractTextPlugin.extract(
    'style-loader', 
    'css-loader!postcss-loader!sass-loader' 
);

对于的WebPack 2：

的ExtractTextPlugin期待一个装载机或一个对象。

ExtractTextPlugin.extract(options: loader | object)

例子：

{ 
    test: /\.scss$/, 
    exclude: /node_modules/, 
    loader: ExtractTextPlugin.extract({ 
    fallbackLoader: "style-loader", 
    loader: [ 
     "css-loader", 
     "postcss-loader", 
     "sass-loader" 
    ] 
    }) 
}

来源

2017-04-12 01:20:44 Ricky

感谢您的回复。我在Webpack 1上，并且将我的代码与第一个示例中的代码相匹配。我已经测试过它，但仍然显示我的mixins中的CSS没有通过postcss/autoprefixer达到。 –

我在我的代码中发现的问题。我的入口点文件，其中SCSS文件正在导入，导入了这样：

import styles from '!style-loader!css!sass!postcss-loader!./styles/styles.scss'

这是覆盖在我的webpack.config文件的配置，所以我只是改变了我所有的进口线有正确的加载程序顺序。

来源

2017-04-13 21:31:37

Webpack.config之前没有运行萨斯 - 装载机PostCSS-装载机

回答

相关问题