React4xp: easy react rendering in XP

.gitignore

@@ -90,4 +90,15 @@ crashlytics-build.properties
 
 # Node modules
 node_modules/
-bin/
+
+# Visual studio code project files
+bin/
+.vscode/
+_vscode/
+.project
+.classpath
+.settings/
+
+
+
+**/_AUTOGENERATED_externals_.es6

build.gradle

@@ -18,7 +18,6 @@ node {
 
 
 dependencies {
-
     include "com.enonic.xp:lib-repo:${xpVersion}"
     include "com.enonic.xp:lib-node:${xpVersion}"
     compile "com.enonic.xp:core-api:${xpVersion}"
@@ -27,23 +26,159 @@ dependencies {
     include "com.enonic.xp:lib-portal:${xpVersion}"
     include "com.enonic.xp:lib-io:${xpVersion}"
     include "com.enonic.xp:lib-mustache:${xpVersion}"
+    include "com.enonic.xp:lib-thymeleaf:${xpVersion}"
+
     include "com.enonic.lib:lib-router:1.0.1"
+    include 'com.enonic.lib:util:1.3.0'
+    include 'com.enonic.lib:lib-cache:1.1.0'
+
+    include group: 'org.jdom', name: 'jdom', version: '2.0.2'
+    include group: 'org.json', name: 'json', version: '20180813'
+    include group: 'jaxen', name: 'jaxen', version: '1.1.6'
 }
 
 repositories {
     mavenLocal()
     jcenter()
     xp.enonicRepo()
+    maven {
+        url 'http://repo.enonic.com/public'
+    }
 }
 
 
 
-task webpack(type: NodeTask) {
+npmInstall.inputs.file("package.json")
+npmInstall.inputs.file("package-lock.json")
+npmInstall.outputs.dir("node_modules")
+
+
+// Transpile .js and .es6 files under src/main/resources.
+// These are "pure XP" source code files, not JS (and react) assets. Those must be transpiled separately, by the webpackReact4xp task below.
+// This is currently done by reserving .es6 and .js files below src/main/resources/ for this task,
+// while reserving .JSX files under that, and all relevant extensions in other locations, for the webpackReact4xp task.
+task babelXP(type: NodeTask) {
+    script = file('node_modules/babel-cli/bin/babel.js')
+    args = ["src/main/resources", "--out-dir", "build/resources/main", "--ignore", "**/*.jsx"]
+
+    inputs.dir 'src/main/resources'
+    outputs.dir "build/resources/main"
+}
+babelXP.dependsOn += 'npmInstall'
+babelXP.dependsOn += 'processResources'
+
+import groovy.json.JsonSlurper
+
+task webpack_r4xp_externals(type: NodeTask) {
+    doFirst {
+        /*  Generate an entry file for bundling externals into one cacheable file.
+            For example (if the file webpack.config.constants.json contains an EXTERNALS object like this: { "react": "React", "react-dom": "ReactDOM" } ):
+
+                import ReactDOM from 'react-dom';
+                import React from 'react';
+
+                (function(window){
+                    window.React = React;
+                    window.ReactDOM = ReactDOM;
+                })(typeof window !== 'undefined' ? window : global);
+        */
+
+        String externalsJson = new File('webpack.config.constants.json').text;
+        def jsonSlurper = new JsonSlurper()
+        def exts = jsonSlurper.parseText(externalsJson).EXTERNALS
+
+        def externalsImports = "";
+        def externalsExports = "";
+        exts.each{ k, v -> externalsImports += "import ${v} from '${k}';\n" }
+        //exts.each{ k, v -> externalsImports += "console.log('${v}: ' + ${v});\n" }
+        exts.each{ k, v -> externalsExports += "\twindow.${v} = ${v};\n" }
+
+        def externalsES6 = "// AUTO-GENERATED in gradle task 'webpack_r4xp_externals'\n\n" +
+                externalsImports +
+                "\n(function(window) {\n" +
+                externalsExports +
+                "} )(typeof window !== 'undefined' ? window : global);\n"
+
+        def externalsFile = new File('src/main/react4xp/_AUTOGENERATED_externals_.es6')
+        externalsFile.write externalsES6
+
+    }
+
     script = file('node_modules/webpack/bin/webpack.js')
+    args = ['--config', 'webpack.config.react4xp.externals.js', '--progress', '--color']
+
+    inputs.file("webpack.config.react4xp.externals.js")
+
+    inputs.file("webpack.config.constants.json")
+    inputs.file("webpack.config.constants.js")
+    inputs.file("package.json")
+    inputs.file("package-lock.json")
+    inputs.dir("src/main/react4xp")
+    outputs.dir("build/resources/main/react4xp")
 }
+webpack_r4xp_externals.dependsOn += 'npmInstall'
+
+
+task webpack_r4xp_nashornPolyfills(type: NodeTask) {
+    script = file('node_modules/webpack/bin/webpack.js')
+    args = ['--config', 'webpack.config.react4xp.nashornPolyfills.js', '--progress', '--color']
+
+    inputs.file("webpack.config.react4xp.nashornPolyfills.js")
+
+    inputs.file("webpack.config.constants.json")
+    inputs.file("webpack.config.constants.js")
+    inputs.file("package.json")
+    inputs.file("package-lock.json")
+    inputs.dir("src/main/react4xp")
+    outputs.dir("build/resources/main/react4xp")
+}
+webpack_r4xp_nashornPolyfills.dependsOn += 'npmInstall'
+
+
+task webpack_r4xp_frontCore(type: NodeTask) {
+    script = file('node_modules/webpack/bin/webpack.js')
+    args = ['--config', 'webpack.config.react4xp.core.js', '--progress', '--color']
+
+    inputs.file("webpack.config.react4xp.core.js")
+
+    inputs.file("webpack.config.constants.json")
+    inputs.file("webpack.config.constants.js")
+    inputs.file("package.json")
+    inputs.file("package-lock.json")
+    inputs.dir("src/main/react4xp")
+    outputs.dir("build/resources/main/react4xp")
+}
+webpack_r4xp_frontCore.dependsOn += 'npmInstall'
+
+
+task webpack_r4xp(type: NodeTask) {
+    script = file('node_modules/webpack/bin/webpack.js')
+    args = ['--config', 'webpack.config.react4xp.js', '--progress', '--color']
+
+    inputs.file("webpack.config.react4xp.js")
+    inputs.dir("src/main/resources/site")
+
+    inputs.file("webpack.config.constants.json")
+    inputs.file("webpack.config.constants.js")
+    inputs.file("package.json")
+    inputs.file("package-lock.json")
+    inputs.dir("src/main/react4xp")
+    outputs.dir("build/resources/main/react4xp")
+
+    /*doLast {
+         file("build/resources/main/assets/index.html").renameTo(file("build/resources/main/index.html"))
+    }*/
+}
+webpack_r4xp.dependsOn += 'npmInstall'
+
+
 
 // processes your package.json before running webpack
-webpack.dependsOn 'npmInstall'
-webpack.dependsOn 'processResources'
+jar.dependsOn babelXP
+jar.dependsOn += 'webpack_r4xp'
+jar.dependsOn += 'webpack_r4xp_frontCore'
+jar.dependsOn += 'webpack_r4xp_externals'
+jar.dependsOn += 'webpack_r4xp_nashornPolyfills'
+
+jar.outputs.dir('build/libs')
 
-jar.dependsOn webpack