问题标签 [webpacker]

我正在尝试 webpack（在 Railswebpacker库的上下文中），并希望将生成的包用于服务器渲染 React 组件。

我可以很好地从本地开发服务器获取文件，但是当我将它们加载到我的服务器端 JavaScript 上下文中时问题就来了。（我正在使用 Ruby 的ExecJS，由 支持therubyracer，它是与 V8 的 Ruby 绑定。）

由于捆绑包来自 webpack-dev-server，它包含一堆用于设置热模块重新加载的代码。此代码假定它是从script标记加载的，因此它会对页面的 URL 进行一些检查。在纯 V8 上下文中，没有URL，因此我们会遇到很多错误，例如：

因为它试图读取self.location.protocol. （self存在，但self.location不存在。）

我开始模拟各种 DOM API 以使错误消失，但我想知道，有没有合适的方法来做到这一点？例如：

• 我可以在没有HMR 代码的情况下从 webpack-dev-server 获取捆绑包吗？
• 我可以以某种方式绕过 HMR 代码（除了添加大量模拟之外）吗？

我正在尝试rails使用webpack. webpacker但是当我部署到生产环境时，它失败了：

由于.postcssrc.yml位于/home/user/app/tmp/build-.../.postcssrc.yml，它不是相对于/home/user/app/shared/node_modules/bootstrap-fileinput/css/fileinput.css. 因为我node_modules在版本之间共享目录。我该怎么办，否则不共享目录？

我用 webpacker 创建了示例项目 react-rails。但显示错误“未捕获的 ReferenceError：未定义人员”。帮助我如何在 webpacker 中使用 react-rails？我执行的处理如下。

导轨版本

宝石版

创建 Rails 项目

将 webpacker 和 react-rails 添加到 Gemfile

安装 webpacker 并做出反应

创建控制器

添加路线

添加反应组件

添加 react_component 标签

将 javascript_pack_tag 添加到 application.html.erb

运行服务器

显示错误控制台

示例项目

https://github.com/yokochi/webpacker_example

我需要获取绝对 url 一个 javascript 包，我无法找到在源代码中执行此操作的方法。

我正在尝试让react-rails gem（2.1 版）在我的 Rails 4.2.4 应用程序中工作。我已经完成了自述文件中的设置步骤，并且正在使用 webpacker 进行 js 预处理。我里面有一个组件app/javascript/components/label.js，看起来像这样：

然后我在我的观点中引用了以下行：

据我从自述文件中可以看出，这应该是渲染组件所必需的（假设应用程序包包含在布局中，就是这样）

所以我很困惑为什么我的浏览器中出现了组件未定义的错误。

打开app/javascript/packs/application.js我可以看到以下内容：

首先我验证了控制台日志显示在浏览器中（它是）。我不确定是什么componentRequireContext，但如果它是相对于当前文件的，那么它指向componentsand not似乎很奇怪../components，但是改变它并不会呈现组件。但是，如果我添加以下行，我可以获得组件渲染：

我认为 React Rails gem 可以解决这个问题，前提是组件保存在app/javascript/components目录中？自述文件中没有任何内容说我需要明确声明和要求组件，还是我弄错了？

我在一个项目上运行 Rails 5.0.2，希望在前端使用react-rails和处理事情。webpacker我只有几个需要动态的组件/页面，所以我对大多数页面使用服务器端渲染。

就我react-rails而言，我有一个非常标准的webpacker. 按照他们自述文件中的说明进行操作后，我可以加载包含 CommonJS 模块之类的页面。

问题：由于 webpacker 正在提供其资产localhost:8080并且 rails 正在运行localhost:3000，因此我在站点的静态部分启动的会话 cookie 无法被动态部分访问。我知道我可能可以使用 nginx 代理解决这个问题，但我想知道是否没有使用上述工具来解决这个问题，因为这对于本地开发人员来说是一种游戏破坏者！

我尝试通过将其添加到 webpack/loaders 目录来设置 webpack 加载器

然后从 .js 代码中要求适当的模板文件。

但我收到以下错误

这对其他人有用吗？我正在使用 angular 1.6，所以我需要使用不同的模块吗？

我正在尝试使用 Rails 5.1 的新 webpacker gem 以及 VueJS，但无法让我的 erb 视图将数据传递给 VueJS 组件......

假设我有一个用户显示视图

还有我的 javascript：

到目前为止，我已经为此花费了几个小时，但我的任何尝试都没有被证明是成功的。我尝试将数据作为 prop: 传递给组件 props: ['username']，使用

...但这也不起作用

更新：我在组件中丢失props: ['username']并相应地更新了上面的代码，尽管这似乎没有什么不同。还是没有运气！

我不断收到以下错误代码，我不知道如何解决这个问题。我真的不知道我应该如何配置 webpack 以在我的网站上运行 react，设置起来非常混乱。我尝试使用https://github.com/shakacode/react_on_rails上的指南，但我没有发现它对解决这个问题很有帮助。

/bin/webpack.rb

错误信息

从app/javascript/packs/application.js我试图到import "../foo"文件所在的位置foo.js.erb。Webpacker 和 yarn 对于 application.js 中的其他导入非常有效，例如import "../bar"当该文件是bar.js但如果我尝试使用.js.erb文件时，我会从 webpack-dev-server 收到此错误：

rails webpacker:install我确实安装了 rails-erb-loader 并且如果我查看 webpacker 配置，erb 加载器正在被评估并且看起来对我来说是正确的，尽管除了运行以生成该配置之外我没有触及任何东西。