I have the following entrypoint:
import { initNaja } from "./modules/naja";
import { initBootstrap } from "./modules/bootstrap";
import { initForms } from "./modules/forms";
import { initTopbar } from "./modules/topbar";
import { initEditor } from "./modules/editor";
import "./css/index.scss";
const naja = initNaja();
initBootstrap();
initForms();
initTopbar();
initEditor(naja);
// Datagrid must be imported after Naja is initialized because the underlying
// dependencies require Naja from the window.
import("./modules/datagrid").then(({ initDatagrid }) => initDatagrid());
I need to import "modules/datagrid" after everything else because a dependent library needs to set a property to the window and unfortunetely the datagrid library doesn't have an option to pass the properties differently.
Unfortunetely I get the following error:
ChunkLoadError: Loading chunk vendors-node_modules_ublaboo-datagrid_assets_datagrid-instant-url-refresh_js-node_modules_ubl-b2fe22 failed.
(error: http://localhost:3000/vendors-node_modules_ublaboo-datagrid_assets_datagrid-instant-url-refresh_js-node_modules_ubl-b2fe22.js)
at Object.__webpack_require__.f.j (main.js:14503:29)
at main.js:13878:40
at Array.reduce (<anonymous>)
at Function.__webpack_require__.e (main.js:13877:67)
at Function.fn.e (main.js:14086:50)
at Module../src/index.ts (main.js:3432:49)
at __webpack_require__ (main.js:13824:33)
at main.js:15059:37
at main.js:15061:12
I use webpack-encore for configuration, here's my config:
const encore = require("@symfony/webpack-encore");
const path = require("path");
encore
.configureRuntimeEnvironment(
["dev", "development"].includes(process.env.NODE_ENV) ? "dev" : "production"
)
.setOutputPath(path.join(__dirname, "..", "public", "admin_assets"))
.setPublicPath("/")
.disableSingleRuntimeChunk()
.addEntry("main", path.join(__dirname, "src", "index.ts"))
.enablePostCssLoader()
.enableSassLoader()
.autoProvidejQuery()
.enableBabelTypeScriptPreset();
module.exports = encore.getWebpackConfig();
```