使用 webpack 在 Rails 上将 LostGrid 添加到 Ruby

Question

这里是第一张海报。我刚刚使用 webpack (rails new myapp --webpack) 创建了一个新的 Rails 项目。它带有 PostCSS，我想从 Lost:

添加 LostGrid to it. I ran the following, from the installation instructions

npm install --save lost

这将丢失添加到 package.json。说明然后说要将以下内容添加到您的 webpack 配置中，假设您已经安装并配置了 postcss-loader（据我所知，它是在创建项目时自动安装的）：

postcss: [
  require('lost')
]

但我不明白文件在哪里。我认为我需要将我的 PostCSS 内容添加到根目录中的 .postcssrc.yml。我这样做了，但我仍然无法正常工作。

我对 webpack 的经验很少，怀疑我的方法完全有缺陷。我很高兴能在 Rails 中使用 PostCSS，并且非常感谢任何帮助让 LostGrid 在这里工作。谢谢！

Answer 1

在我运行进入同一问题后不久发现了您的问题。幸运的是它真的很简单！

当您运行 webpacker:install 时，它会在项目的根文件夹中安装一个名为 .postcssrc.yml 的文件。这是您添加 PostCSS 插件的地方。我的现在看起来像这样：

  plugins:
      lost: {}
      postcss-smart-import: {}
      postcss-cssnext: {}
      autoprefixer: {}

我不确定顺序是否重要。还在研究那个。

请参阅 Webpacker issue #283，本质上是同一个问题，但没有提供示例。

Adding LostGrid to Ruby on Rails with webpack