使用 webpack 将 LostGrid 添加到 Ruby on Rails答案

【问题标题】：Adding LostGrid to Ruby on Rails with webpack使用 webpack 将 LostGrid 添加到 Ruby on Rails
【发布时间】：2017-10-15 23:19:15
【问题描述】：

这里是第一张海报。我刚刚使用 webpack (rails new myapp --webpack) 创建了一个新的 Rails 项目。它带有 PostCSS，我想在其中添加 LostGrid。我从Lost的安装instructions中运行了以下内容：

npm install --save lost

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

postcss: [
  require('lost')
]

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

我对 webpack 的经验很少，我怀疑我的方法完全有缺陷。我很高兴能在 Rails 中使用 PostCSS，如果能帮助我让 LostGrid 在这里工作，我将不胜感激。谢谢！

【问题讨论】：

【解决方案1】：

在我遇到相同问题后不久发现了您的问题。幸运的是它真的很简单！

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

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

我还不确定订单是否重要。仍在研究中。

请参阅Webpacker issue #283，这基本上是相同的问题，但没有提供示例。

【讨论】：