postcss-salad 在用栅格 布局的时候报错?

使用postcss-salad插件
但在使用的时候

.group.yzm input{
  @neat-span-columns 6;
}

转义报错

ERROR in ./~/css-loader!./~/postcss-loader!./src/pages/login/style.postcss
Module build failed: TypeError: _decl.value.indexOf is not a function
...

又遇到这种情况的吗?
package.json 配置
"postcss-loader": "^0.13.0",
"postcss-plugin-px2rem": "^0.6.0",
"postcss-salad": "^1.0.5",

阅读 2.6k
1 个回答

通过我的简单的介绍, 不知道你的问题解决没, 思路回顾:

经过我的反复大量的测试, 初步推断, 插件与autoprefixer有冲突, 调整了autoprefixer的顺序后, 即可编译, 当然cssnano也会导致问题存在. 具体优化方案有待调整, 我发布了分支postcss-neat你可以参考下.

我又测了一会, 当然也有可能和其他插件有冲突, 比如你使用的px2rem, 我这里就不再测试了, 给你的建议就是:

  • 搞清楚PostCSS的插件的执行方式和流程, 知道自己用的插件究竟是什么目的, 参阅PostCSS自学笔记(二)【番外篇二】
  • 实在不知道的情况下, 还是搞一个简单的demo比如我刚提到的我那个分支, 有时候感觉很麻烦, 但是他更容易解决问题, 并带来意想不到的收获?

然后根据你这个真实环境, 我测了一下. 也发布了有一个分支=- =postcss-salad.

的确还是插件执行顺序问题. 我这里编译正常, 我的postcss.config.js如下:

module.exports = {
  parser: 'postcss-scss',
  plugins: [
    require('postcss-plugin-px2rem'),
    require('postcss-salad'),
    require('postcss-neat')
  ]
};

另外你在学习使用过程中, 多看看插件文档, 比如这个饿了么的这个salad, 包含以下这些插件https://github.com/ElemeFE/po..., 有时候也许这里面的插件也会和其他插件发生冲突, 所以需要注意.

希望有所帮助~

推荐问题
宣传栏