将Rails Env公开到Webpacker

Question

我正在用Webpacker v2运行Rails v5。到目前为止，一切都还很顺利，但是我遇到了一个麻烦：如何将Rails助手公开给我的TypeScript。

我知道Webpacker随rails-erb-loader一起提供，所以我期望能够添加.erb到TypeScript文件，然后将该文件导入其他地方：

// app/javascript/utils/rails.ts.erb
export const env = "<%= Rails.env %>"

export function isEnv(envName: string) {
  return env == envName
}

// app/javascript/packs/application.ts
import { env } from "../utils/rails"

但是，即使我将打字稿加载程序修改为包括ERB文件，Webpack也找不到“ rails”文件：

module.exports = {
  test: /.ts(\.erb)?$/,
  loader: 'ts-loader'
}

我所看到的是：

error TS2307: Cannot find module '../utils/rails'.

将Rails帮助器和变量暴露给我的JavaScript的最佳方法是什么？

Answer 1

Rails env来自您的环境变量。这意味着您可以通过以下方式（例如在bash中）设置变量来配置它：

export RAILS_ENV=production

因此，您根本不需要处理Rails。

// app/javascript/utils/rails.ts.erb
export const env = process.env.RAILS_ENV || "development"

export function isEnv(envName: string) {
  return env == envName
}

这具有很大的优势：您不必为了编译javascript而加载整个rails应用程序。如果您的应用不断增长，Rails在首次加载时可能会变得非常缓慢。

由于您将无法访问process.env前端（浏览器），因此还需要一种使它存在的方法。在webpack中，这是通过以下方式完成的DefinePlugin：

更新Webpack配置以使用插件（在plugins部分中）：new webpack.DefinePlugin({ "process.env": { RAILS_ENV: process.env.RAILS_ENV } })您将process.env.RAILS_ENV在客户端中获得可用的插件