Question

我正在使用Webpacker v2运行Rails v5。到目前为止，一切顺利，但我遇到了一个打嗝：如何向我的TypeScript公开Rails助手。

我知道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"

但Webpack无法找到＆＃34; rails＆＃34;即使我修改typescript加载器以包含ERB文件：

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
}

这有一个很大的优势：您不必加载整个rails应用程序只是为了编译您的JavaScript 。如果您的应用程序增长，Rails在第一次加载时会变得非常慢。

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

完成的

更新您的网络包配置以使用该插件（位于plugins部分）：new webpack.DefinePlugin({ "process.env": { RAILS_ENV: process.env.RAILS_ENV } })，您将在客户端获得process.env.RAILS_ENV

Answer 2

Rails Env可以通过以下方式访问：

process.env.RAILS_ENV

将Rails Env暴露给Webpacker

2 个答案: