sbt / sbt-rjs

RequireJs optimizer plugin for sbt-web
Other
39 stars 28 forks source link

mainConfig not working #79

Closed johdah closed 7 years ago

johdah commented 7 years ago

I have a project that looks like this that uses babel to transpile js so that it's compatible with requirejs. I looked at the test project and followed that example. But when i visit this in the browser I get.

"require.min.js:5 Uncaught Error: Script error for "react", needed by: main"

Have I missunderstood how I get rjs to load the build.js config?

build.sbt

...
import WebJs._
import RjsKeys._
pipelineStages := Seq(rjs)
RjsKeys.mainConfig := "common"
...

app/assets/javascripts/common.js

requirejs.config({
    paths: {
        'react':                    '../bower_components/react/react-with-addons.min',
        'react-dom':            '../bower_components/react/react-dom.min',
...
    }
});

app/assets/javascripts/main.js

import ReactDOM from 'react-dom';
import Spinner from 'components/spinner';

const App = React.createClass({displayName: "App",
    render: function() {
        let page = <Spinner />;

        return (
            <div>{page}</div>
        );
    }
});

ReactDOM.render(
    <App />,
    document.getElementById("container")
);

index.scala.html

...
<script data-main='@routes.Assets.versioned("javascripts/main.js")' src='@routes.WebJarAssets.at(WebJarAssets.locate("require.min.js"))' type='text/javascript'></script>
...

transpiled main.js

(function (global, factory) {
    if (typeof define === "function" && define.amd) {
        define(['react-dom', 'components/spinner'], factory);
    } else if (typeof exports !== "undefined") {
        factory(require('react-dom'), require('components/spinner'));
    } else {
        var mod = {
            exports: {}
        };
        factory(global.reactDom, global.spinner);
        global.main = mod.exports;
    }
})(this, function (_reactDom, _spinner) {
    'use strict';

    var _reactDom2 = _interopRequireDefault(_reactDom);

    var _spinner2 = _interopRequireDefault(_spinner);

    function _interopRequireDefault(obj) {
        return obj && obj.__esModule ? obj : {
            default: obj
        };
    }

    const App = React.createClass({ displayName: "App",
        render: function () {
            let page = React.createElement(_spinner2.default, null);

            return React.createElement(
                'div',
                null,
                page
            );
        }
    });

    _reactDom2.default.render(React.createElement(App, null), document.getElementById("container"));
});