Currently, Google Apps Script does not support ES modules - and any usage of export/import will fail. One way of handling this is to use rollup.js to bundle your project into one single JavaScript file. The trick here is to make sure not to export any functions in your entry point code, e.g. index.ts , and to prevent any generation of export statement in the final bundle (see the custom rollup plugin in the rollup.config.js below). import { babel } from "@rollup/plugin-babel"; import { nodeResolve } from "@rollup/plugin-node-resolve"; const extensions = [".ts", ".js"]; const preventThreeShakingPlugin = () => { return { name: 'no-threeshaking', resolveId(id, importer) { if (!importer) { // let's not theeshake entry points, as we're not exporting anything in Apps Script files return {id, moduleSideEffects: "no-treeshake" } } return null; }...
So you have your custom frontend project with a huge webpack configuration file, while enviously looking at some newer code bases based on Create React App from Facebook? Or, you've started out with a vanilla Create React App, but felt that you needed to eject (even though many advised you not to)? Either way, wouldn't it be nice to be able to re-use some of that magic in a dependency-kind-of-way? After all, Facebook's configuration is probably more tested and thought-through than yours! :) Well, you can! All that Webpack magic, incl. Jest and Webpack Dev Server configuration, is packaged by Facebook in react-scripts . Internally, Create React App is using it, but that doesn't help us, right? In this post, I'll show you how. In order to be able to tap into react-scripts we first need to install them as a dependency using npm install react-scripts --save-dev . This is where the fun begins! In essence, you create a webpack.shared.config.js and import the ba...