0

我正在使用 Rails 5.1 和 Webpacker。一切正常。我在 /app/javascripts/images 中的 react 组件中使用图像，我将它们很好地导入到我的组件中，一切都在开发中。

但是 - 当我部署时，内部图像现在直接从我的站点 url 提供（使用他们的 webpacker 编译路径，但问题是我已经将我的生产环境设置为使用asset_host - 所以 Rails 正确地为我所有其他常用 Rails 添加了前缀图像资产（包括我的 react JS 包） - 所以它们都可以从我的资产主机正确提供。

只是我导入到我的反应组件中的 /app/javascripts/images 中的内部图像 - 它们不是通过asset_host代理的。（它在开发中运行良好——因为我没有在那里使用asset_host）。

我如何让 webpacker 知道我需要在生产环境中通过 assets_host 代理的图像？

4

2 回答 2

0

我设法像这样设置我的config/webpack/environment.js文件：

const { environment } = require('@rails/webpacker')
const env = process.env.NODE_ENV || 'development'
const { resolve } = require('path')
const { safeLoad } = require('js-yaml')
const { readFileSync } = require('fs')
const filePath = resolve('config', 'webpacker.yml')
const appConfig = safeLoad(readFileSync(filePath), 'utf8')[env]
const config = appConfig

const removeOuterSlashes = string =>    
  string.replace(/^\/*/, '').replace(/\/*$/, '')

const formatPublicPath = (host = '', path = '') => {    
  let formattedHost = removeOuterSlashes(host)    
  if (formattedHost && !/^http/i.test(formattedHost)) {   
    formattedHost = `//${formattedHost}`    
  }   
  const formattedPath = removeOuterSlashes(path)    
  return `${formattedHost}/${formattedPath}/`   
}

const fileLoader = environment.loaders.get('file')
fileLoader.use[0].options.publicPath = formatPublicPath(process.env.WEBPACKER_ASSET_HOST, config.public_output_path)

module.exports = environment

根据此处的以下评论：https ://github.com/rails/webpacker/issues/1186#issuecomment-358110765

于 2018-02-01T06:01:54.790 回答
0

您可以将环境参数“ process.env.WEBPACKER_ASSET_HOST”添加到/config/webpack/production.js文件中。

process.env.NODE_ENV = process.env.NODE_ENV || 'production'

process.env.WEBPACKER_ASSET_HOST = process.env.WEBPACKER_ASSET_HOST || '/yourpath/'

const environment = require('./environment')

module.exports = environment.toWebpackConfig()

我在rails6工作。希望这可以帮助某人

于 2020-03-05T02:41:00.313 回答