Search code examples
reactjshubspot-cms

CLI upload main.js file size limited when building with react and threejs


Is there a way around the file size limitation when building with react and threejs? I am building a react module with three js using the cms-react-boilerplate. The project builds fine, but it can't upload the main.js file as it is 2.1MiB. It gives me the following error:

[ERROR] Error validating template. [ERROR] line 0: Coded files must be smaller than 1.5 MiB

I tried to upload the file directly to the design manager but was given the same error. I also tried to create a main.js file and paste the code into it, but was given the following error:

Error:Coded file buffer must be smaller than 2.0 MiB


Solution

  • I'd recommend enabling code splitting. If not, you're going to need to use a different host for the JavaScript files. Additionally – make sure you're correctly including only what you need.

    Avoid:

    import * as x from 'lib';
    

    and instead do:

    import { each, func, you, need } from 'lib';
    

    This will allow bundlers such as Webpack to properly Tree Shake your dependencies.