RE: Contribute requirejs.config.paths to ModuleManager

Svein-Erik Løken <[email protected]> Fri, 24 Nov 2017 17:20:44 +0000
Newsgroups	gmane.comp.java.tapestry.user
Message-ID	<DB3PR08MB0283D069B171C47CA9A872B6D2260@DB3PR08MB0283.eurprd08.prod.outlook.com>
React can in theory be used in all pages (globally). It will be like a core library for me, like jquery, underscore, bootstrap, etc. In TypeScript I am using
"compilerOptions": {
    "module": "amd".

I have written a service:
@Override
public void appendToModulePath(JSONObject cfg) {
    javaScriptSupport.addModuleConfigurationCallback(configuration -> {
        if (!configuration.has("paths")) {
            configuration.put("paths", cfg);
        } else {
            configuration.getJSONObject("paths").putAll(cfg.toMap());
        }
        return configuration;
    });
}

I am now calling this in my global <html t:type="layout", and adding paths like “leaflet”:”leaflet-src” on pages with a map.

Setting requirejs.config.paths globally should not load anything until loaded by require.
E.g: JS from a transpiled TypeScript with React: define(["require", "exports", "react", "react-dom"], function (require, exports, React, ReactDOM) {

I can try the Mixin technique, but still think Tapestry should have a way of contribute requirejs.config.paths.  You have a nice way contribute requirejs.config.shim which maybe could be modified to also accept paths. To support modern JS frameworks I think setting requirejs.config.paths in a nice way globally should be implemented.

S-E

From: Thiago H de Paula Figueiredo [via Apache Tapestry Mailing List Archives] [mailto:[email protected]]
Sent: fredag 24. november 2017 17.02
To: Svein-Erik Løken <[email protected]>
Subject: Re: Contribute requirejs.config.paths to ModuleManager

On Fri, Nov 24, 2017 at 11:13 AM, Svein-Erik Løken <[hidden email]</user/SendEmail.jtp?type=node&node=5733722&i=0>> wrote:

Hello!

Trying to use TypeScript and React with Tapestry:
>
> In TypeScript I need to use:  import * as React from "react";
>
> I would like to load react: react.min, so I have to set paths: {...}
>
> The configuration should be set at startup, but I cannot figure how to do
> it. I can set requirejs.config.shim, but not paths.
>

Are you using React in all pages or just some of them?

>
> I tried to load it with @Contribute(ModuleManager.class), but could not
> figure out how.
>
> PSEUDO CODE
> @Contribute(ModuleManager.class)
> public static void setupMyBaseModules(MappedConfiguration<String, Object>
> configuration) {
>     JSONObject pathsConfig = new JSONObject(
>             "react", "react.min",
>             "react-dom", "react-dom.min"
>     );
>     AMDResourceConfiguration paths = new AMDResourceConfiguration("paths",
> pathsConfig);
>     configuration.add(null, new JavaScriptModuleConfiguration(paths));
> }
>

MappedConfiguration, as far as I can remember, doesn't accept null as the
contribution id. Even if it does, it's a bad idea.

> Tried to load it this way:
> @Startup
> public void registerToClearPlasticProxyFactoryOnInvalidation(JavaScriptSupport
> javaScriptSupport) {
>     ModuleConfigurationCallback callback = new
>             ModuleConfigurationCallback() {
>                 @Override
>                 public JSONObject configure(JSONObject configuration) {
>                     configuration.put("paths",
>                             new JSONObject(
>                                     "react", "react.min",
>                                     "react-dom", "react-dom.min"
>                             ));
>                     return configuration;
>                 }
>             };
>     javaScriptSupport.addModuleConfigurationCallback(callback);
> }



> [ERROR] ioc.Registry org.apache.tapestry5.ioc.util.UnknownValueException:
> No object of type org.apache.tapestry5.services.javascript.JavaScriptSupport
> is available from the Environment.


I'm afraid this isn't the correct way of using
JavaScriptSupport.addModuleConfigurationCallback(). It should be used while
rendering a page or handling an event. The way you did it above, you're
trying to add JavaScript at application startup. You need to do this in
page or component classes.


> Now I am loading the configuration in @SetupRender, but it should be
> loaded globally.
>

Define "globally", please. All pages, including error ones? Most pages? The
better way of doing this is moving this code to a mixin and apply it to the
pages where you need React. If you want it in all pages, you can contribute
a ComponentClassTransformWorker2 to the service with the same name which
applies the mixin to all pages. See
MutableComponentModel.addMixinClassName().

--
Thiago

________________________________
If you reply to this email, your message will be added to the discussion below:
http://apache-tapestry-mailing-list-archives.1045711.n5.nabble.com/Contribute-requirejs-config-paths-to-ModuleManager-tp5733721p5733722.html
To unsubscribe from [email protected]<mailto:[email protected]> Mailing List Archives, click here<http://apache-tapestry-mailing-list-archives.1045711.n5.nabble.com/template/NamlServlet.jtp?macro=unsubscribe_by_code&node=2375125&code=c3ZlaW5AamFjaWxsYS5ub3wyMzc1MTI1fC0xNTM4NzY2ODg4>.
NAML<http://apache-tapestry-mailing-list-archives.1045711.n5.nabble.com/template/NamlServlet.jtp?macro=macro_viewer&id=instant_html%21nabble%3Aemail.naml&base=nabble.naml.namespaces.BasicNamespace-nabble.view.web.template.NabbleNamespace-nabble.view.web.template.NodeNamespace&breadcrumbs=notify_subscribers%21nabble%3Aemail.naml-instant_emails%21nabble%3Aemail.naml-send_instant_email%21nabble%3Aemail.naml>