标签: browserify-rails

我正在使用 browserify-rails + babelify在react + rails项目中转换jsx.

我很困惑为什么// require('');需要components.js(这是反应的安装点)让jsx转换工作.

如果我删除注释行 // require('');,我会得到"SyntaxError:Unexpected token import"

目前我没有任何线索,为什么一行评论会影响转换.我也很困惑,如果这是一个反应,或babelify,或浏览器,或browserify-rails,或rails资产管道的问题.

有关完整的代码库,请参阅https://github.com/sidazhou/react_rails_skeleton/tree/v0.0.1

components.js

// require(''); // somehow this is necessary, why?! Otherwise we get: "SyntaxError: Unexpected token import"
import React from 'react';
import ReactDOM from 'react-dom';
import Widgets from './components/Widgets.jsx';

ReactDOM.render( <Widgets />, document.getElementById('react_component') );

的package.json

{
  "name": "react-sample",
  "dependencies": {
    "babel-preset-es2015": "^6.3.13",
    "babel-preset-react": "^6.3.13",
    "babelify": "^7.2.0",
    "browserify": "^12.0.1",
    "browserify-incremental": "^3.0.1",
    "history": "^1.13.1",
    "material-ui": "^0.13.4",
    "react": "^0.14.3",
    "react-dom": "^0.14.3",
    "react-router": "^1.0.2", …

我在我的应用程序中使用rc-slider组件,并且必须添加一个功能以满足我的需求.

我分叉了主存储库并将我的更改推送到此分支.

在应用程序中,我更改了package.json如下所示并再次运行npm install:

"rc-slider": "Rodrigora/slider#add-label"

没有改变.似乎npm不会更新依赖项.

所以,我删除了node_modules和rails cache文件夹并再次运行install命令:

rm -rf node_modules/
rake tmp:cache:clear
npm install

现在,我有这个错误:

events.js:142
      throw er; // Unhandled 'error' event
      ^

Error: Cannot find module 'rc-slider' from '/Users/rodrigora/project/app/assets/javascripts'

rc-slider当我使用修改的分支时,NPM找不到.

• NPM不更新只更改package.json文件的依赖项？
• 我应该运行一些构建命令来安装我的分支代码吗？

我正在使用browserify-rails并且我正在尝试使用sprockets来预处理包含sprockets指令的文件,因此当我require()使用browserify时,它将包含生成的JavaScript.

sprockets指令尝试包含gem js-routes的输出,以便允许我从clientside访问Rails路由.

这是我的设置(内app/assets/javascripts):

system/
  rails_routes.js
application.js

application.js是主文件,它运行应用程序的其余部分.我希望能够做类似的事情

var rr = require("./system/rails_routes.js");

在其中,并访问路由对象.

在内system/react_routes.js,我有以下内容:

//= require js-routes

console.log("Does this work?");

(顺便说一句,我配置js-routes为将输出放在一个被调用的对象中module.exports,以符合CommonJS模型,如railsware/js-routes#121中所述)

唯一的问题是,当我查看生成的bundle时,sprockets指令仍然存在并且尚未展开.

该console.log电话还存在,并得到我时执行require()该模块.

有没有办法让这个工作？在使用browserify-rails捆绑文件之前让链接器预处理文件的正确方法是什么？