main.js points to non-existent file

[stchang]

Trying to revive this app again.

The latest racketscript doesn't create a dist/compiled.js (I think due to this change? https://github.com/vishesh/racketscript/pull/183) so the static/main.js symlink doesnt point to anything.

What is the current recommended way to package racketscript output for a browser?

[vishesh]

I think that's the client side code. We have a --target parameter, which has babel-webpack which is used to produce that single file. Checkout js-support/babel-webpack folder.

There was some other weirdness around being able to load the currently compiled file to browser, by making all the obvious dependencies available already and just compiling the file given. The output would then go through traceur. We may not longer need the traceur part, or even babel as modules are supported. Just should be ok with using webpack to package into same file (for client code).

I'm not sure what's the recommended way to do package things for browsers as haven't done anything JavaScript for long time, but I think webpack and closure-compiler are still popular.

[vishesh]

I quickly tried to run babel-webpack target and its broken. Here's some WIP, will see if I can get it working sometime today:

From a61df26c8ec36f0ab83683c0cf53c5ab0297e62b Mon Sep 17 00:00:00 2001
From: Vishesh Yadav <vishesh3y@gmail.com>
Date: Tue, 8 Jun 2021 17:28:23 -0700
Subject: [PATCH] See if webpack works

---
 .../js-support/babel-webpack/gulpfile.js      | 42 +++++++------------
 .../js-support/babel-webpack/package.json     | 30 ++++++-------
 2 files changed, 29 insertions(+), 43 deletions(-)

diff --git a/racketscript-compiler/racketscript/compiler/js-support/babel-webpack/gulpfile.js b/racketscript-compiler/racketscript/compiler/js-support/babel-webpack/gulpfile.js
index b031e18..33ea6fc 100644
--- a/racketscript-compiler/racketscript/compiler/js-support/babel-webpack/gulpfile.js
+++ b/racketscript-compiler/racketscript/compiler/js-support/babel-webpack/gulpfile.js
@@ -1,42 +1,28 @@
 const gulp = require('gulp');
 const babel = require('gulp-babel');
 const replace = require('gulp-replace');
-const uglify = require('gulp-uglify');
 const webpackStream = require('webpack-stream');
 const webpack = require('webpack');
-//const BabiliPlugin = require("babili-webpack-plugin");
+const UglifyJsPlugin = require("uglifyjs-webpack-plugin");

 const target = "~a" + ".rkt.js";

 gulp.task('transform', function() {
     return gulp.src(['./**/*.js',
-            '!./node_modules/**',
-            '!./dist/**',
-            '!./*.js'])
-   .pipe(webpackStream({
-       watch: false,
-       module: {
-       loaders: [
-           {
-           test: /\.js$/,
-           exclude: /(node_modules|bower_components)/,
-           loader: 'babel-loader',
-           query: {
-               presets: ["env"],
-           }
-           }
-       ]
-
-       },
-       plugins: [new webpack.optimize.UglifyJsPlugin()
-             /* new BabiliPlugin() (BabaliWebpackPlugin) */],
-       output: {
-       filename: 'compiled.js'
-       }
-   }))
+            '!./node_modules/**',
+            '!./dist/**',
+            '!./*.js'
+        ])
+        .pipe(webpackStream({
+            watch: false,
+            plugins: [new UglifyJsPlugin()],
+            output: {
+                filename: 'compiled.js'
+            }
+        }))
         .pipe(gulp.dest('dist'));
 });

-gulp.task('build', gulp.series('transform', function () {}));
+gulp.task('build', gulp.series('transform', function() {}));

-gulp.task('default', gulp.series('build', function () {}));
+gulp.task('default', gulp.series('build', function() {}));
diff --git a/racketscript-compiler/racketscript/compiler/js-support/babel-webpack/package.json b/racketscript-compiler/racketscript/compiler/js-support/babel-webpack/package.json
index 048fa18..8563beb 100644
--- a/racketscript-compiler/racketscript/compiler/js-support/babel-webpack/package.json
+++ b/racketscript-compiler/racketscript/compiler/js-support/babel-webpack/package.json
@@ -4,27 +4,27 @@
     "description": "Package JavaScript compiled from RacketScript (Racket->JS compiler)",
     "main": "./dist/compiled.js",
     "repository": {
-   "type": "git",
-   "url": "https://github.com/vishesh/racketscript"
+        "type": "git",
+        "url": "https://github.com/vishesh/racketscript"
     },
     "keywords": [
-   "racket",
-   "compiler"
+        "racket",
+        "compiler"
     ],
     "author": "Vishesh Yadav",
     "bugs": {
-   "url": "https://github.com/vishesh/racketscript/issues"
+        "url": "https://github.com/vishesh/racketscript/issues"
     },
     "dependencies": {
-   "gulp": "^4.0.2",
-   "gulp-replace": "*",
-   "gulp-babel": "*",
-        "gulp-uglify": "*",
-   "hamt_plus": "*",
-   "babel-core": "*",
-   "babel-plugin-transform-runtime": "*",
-   "babel-preset-env": "*",
-   "webpack-stream": "*",
-   "babel-loader": "*"
+        "gulp": "^4.0.2",
+        "gulp-replace": "*",
+        "gulp-babel": "*",
+        "uglifyjs-webpack-plugin": "*",
+        "hamt_plus": "*",
+        "babel-core": "*",
+        "babel-plugin-transform-runtime": "*",
+        "babel-preset-env": "*",
+        "webpack-stream": "*",
+        "babel-loader": "*"
     }
 }
-- 
2.30.1 (Apple Git-130)

[vishesh]

Fixing the racketscript side over here https://github.com/vishesh/racketscript/pull/208

[stchang]

fixed with https://github.com/vishesh/racketscript/pull/208