diff --git a/.nvmrc b/.nvmrc index 3c032078..209e3ef4 100644 --- a/.nvmrc +++ b/.nvmrc @@ -1 +1 @@ -18 +20 diff --git a/README.rst b/README.rst index ca12f3f0..bba43b21 100644 --- a/README.rst +++ b/README.rst @@ -88,6 +88,25 @@ Docker (Springload) - Copy cdhweb/settings/local_settings.py.docker-sample to cdhweb/settings/local_settings.py - Run `docker-compose up` +Frontend (Springload) +~~~~~~~~~~~~~~~~~~~~~ + +The frontend uses webpack and npm. + +First, make sure you're using the correct node version: + + nvm use + +If it tells you to install a new version, do so. Then run ``nvm use`` again. + +Install dependencies: + + npm install + +Then to run the site in development mode locally: + + npm start + Setup pre-commit hooks ~~~~~~~~~~~~~~~~~~~~~~ diff --git a/cdhweb/static_src/components/ComponentsInit.tsx b/cdhweb/static_src/components/ComponentsInit.tsx index 98e79a5c..0472449d 100644 --- a/cdhweb/static_src/components/ComponentsInit.tsx +++ b/cdhweb/static_src/components/ComponentsInit.tsx @@ -6,25 +6,14 @@ import MainNavDesktop from './MainNavDesktop/MainNavDesktop.mount'; * * There are two options for types of components: async or sync. * - * - Async means it's a lazy-loaded component (loaded on demand). - * The import would look like, - * - * import('./MyComponent/MyComponent'); - * - * That component should have a default export to mount the - * component. - * + * - `Async` means it's a lazy-loaded component (loaded on demand). * If the component isn't on every page, then it should * probably be Async so that users can avoid downloading it * until necessary. See also * https://webpack.js.org/guides/code-splitting/ * - * - Sync means it's NOT lazy loaded and it's always included - * in the main JavaScript bundle. You would import the file - * using a syntax like - * - * import { MyComponent } from './MyComponent/MyComponent'; - * + * - `Sync` means it's NOT lazy loaded and it's always included + * in the main JavaScript bundle. * If the component loads on every page, especially if it's near * the top (like a primary nav), then it should probably be Sync. * Sync components are included in the top-level JS bundle. diff --git a/package-lock.json b/package-lock.json index ce1ede72..0475e1e0 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4557,12 +4557,12 @@ } }, "node_modules/braces": { - "version": "3.0.2", - "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz", - "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==", + "version": "3.0.3", + "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz", + "integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==", "dev": true, "dependencies": { - "fill-range": "^7.0.1" + "fill-range": "^7.1.1" }, "engines": { "node": ">=8" @@ -6527,9 +6527,9 @@ } }, "node_modules/fill-range": { - "version": "7.0.1", - "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz", - "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==", + "version": "7.1.1", + "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz", + "integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==", "dev": true, "dependencies": { "to-regex-range": "^5.0.1"