I think the JavaScriptStack is the correct way!
I cannot make it work! I thought my code would create a link from module
"react" to /assets/meta/z94ea83c9/react.min.js.
JS: define(["react"], function (react) {
and/or
@AfterRender
void testReactModuleLoading() {
javaScriptSupport.require("react");
}
Log:
Loading 1 libraries
Loading library /assets/meta/z94ea83c9/react.min.js
Executing 3 inits
Loaded module bootstrap/collapse
GET http://localhost:9876/modules.gz/react.js 404 (No module for path
'react.js'.)
Source code:
@Contribute(JavaScriptStackSource.class)
public static void addMyStack(MappedConfiguration<String, JavaScriptStack>
configuration) {
configuration.addInstance("react", ReactStack.class);
}
@Contribute(JavaScriptStack.class)
@Core
public static void addAppModules(OrderedConfiguration<StackExtension>
configuration) {
configuration.add("react", StackExtension.module("react"));
}
public class ReactStack implements JavaScriptStack {
private final AssetSource assetSource;
public ReactStack(final AssetSource assetSource) {
this.assetSource = assetSource;
}
public List<Asset> getJavaScriptLibraries() {
List<Asset> ret = new ArrayList<>();
ret.add(assetSource.getClasspathAsset("/META-INF/assets/react.min.js"));
return ret;
}
@Override
public List<String> getModules() {
List<String> ret = new ArrayList<>();
ret.add("react");
return ret;
}
From: Thiago H de Paula Figueiredo [via Apache Tapestry Mailing List Archives]
[mailto:[email protected]]
Sent: fredag 24. november 2017 22:03
To: Svein-Erik Løken <[email protected]>
Subject: Re: Contribute requirejs.config.paths to ModuleManager
I'm wondering here whether the best approach is the one you've chosen here,
usually used when you're dealing with non-AMD-module-compliant JavaScript
libraries, while React is compliant. I believe you should create a
JavaScriptStack with the React .js files, contribute it to the
JavaScriptStackSource service, then add your module to the core one (i.e.
the one included in all pages). See
https://tapestry.apache.org/javascript-modules.html, section Aggregating
Modules:
Because Tapestry is open, it is possible to contribute modules even into
the *core* JavaScript stack. This is done using your application's module:
@Contribute(JavaScriptStack.class)
@Core
public static void addAppModules(OrderedConfiguration<StackExtension>
configuration) {
configuration.add("tree-viewer", StackExtension.module("tree-viewer"));
configuration.add("app-utils", StackExtension.module("app-utils"));
}
So yes, Tapestry already supports what you want. :)
On Fri, Nov 24, 2017 at 3:20 PM, Svein-Erik Løken <[hidden
email]</user/SendEmail.jtp?type=node&node=5733724&i=0>> wrote:
> 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:[hidden
> email]</user/SendEmail.jtp?type=node&node=5733724&i=1>]
> Sent: fredag 24. november 2017 17.02
> To: Svein-Erik Løken <[hidden
> email]</user/SendEmail.jtp?type=node&node=5733724&i=2>>
> 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 [hidden
> email]</user/SendEmail.jtp?type=node&node=5733724&i=3><mailto:
> [hidden email]</user/SendEmail.jtp?type=node&node=5733724&i=4>> 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>
>
--
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-tp5733721p5733724.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>
