build: npm run build (experimental) (#32823)

This PR implements much of the static assets rework ADR [1], including:

* `npm run build[-dev]`, and its subcommands,
* `npm run webpack[-dev]` and
* `npm run compile-sass[-dev]`.

This is backwards-compatible. `paver update_assets` should not be affected.
The new command warns that it is "experimental" for a few reasons:

* `npm run build` will fail in the webpack phase unless you first
run  `xmodule_assets`. This will be changed soon [2].

* We have tested the new build, but not quite so thoroughly that we'd
recommend it as the production default yet. Once the xmodule_assets
work lands, we'll share this on the forums so early adopters can try it
out.

* The commands lack some top-level documentation. Once they stabilize more,
we'll add a section to the README that explains how and when to use `npm run
build` and its subcommands and its env vars.

* `npm run watch` is not yet implemented.

References:
1. https://github.com/openedx/edx-platform/blob/master/docs/decisions/0017-reimplement-asset-processing.rst
2. #32685

Part of: #31604

package.json

@@ -3,7 +3,13 @@
   "version": "0.1.0",
   "repository": "https://github.com/openedx/edx-platform",
   "scripts": {
-    "postinstall": "scripts/copy-node-modules.sh"
+    "postinstall": "scripts/copy-node-modules.sh",
+    "build": "echo 'WARNING: `npm run build` in edx-platform is experimental. Use at your own risk.' && npm run webpack && npm run compile-sass",
+    "build-dev": "echo 'WARNING: `npm run build-dev` in edx-platform is experimental. Use at your own risk.' && npm run webpack-dev && npm run compile-sass-dev",
+    "webpack": "NODE_ENV=${NODE_ENV:-production} \"$(npm bin)/webpack\" --config=${WEBPACK_CONFIG_PATH:-webpack.prod.config.js}",
+    "webpack-dev": "NODE_ENV=development \"$(npm bin)/webpack\" --config=webpack.dev.config.js",
+    "compile-sass": "scripts/compile_sass.py --env=${NODE_ENV:-production}",
+    "compile-sass-dev": "scripts/compile_sass.py --env=development"
   },
   "dependencies": {
     "@babel/core": "7.19.0",

requirements/constraints.txt

@@ -110,11 +110,16 @@ drf-yasg<1.21.6
 # Adding pin to avoid any major upgrade
 djangorestframework<3.15.0
 
-
 # tests failing with greater version. Fix this in separate ticket.
 pillow<10.0.0
 
 # The version of django-stubs we can use depends on which Django release we're using
 # 1.16.0 works with Django 3.2 through 4.1
 django-stubs==1.16.0
 djangorestframework-stubs==3.14.0  # Pinned to match django-stubs. Remove this when we can remove the above pin.
+
+# Our legacy Sass code is incompatible with anything except this ancient libsass version.
+# Here is a ticket to upgrade, but it's of debatable importance given that we are rapidly moving
+# away from legacy LMS/CMS frontends:
+# https://github.com/openedx/edx-platform/issues/31616
+libsass==0.10.0

requirements/edx/assets.in

@@ -0,0 +1,11 @@
+# Requirements for running `npm run build`.
+
+# This file is NOT included into base.txt, because we do not want to
+# superfluously install frontend build requirements into the production
+# backend requirements.
+
+-c ../constraints.txt
+
+click
+libsass
+nodeenv

requirements/edx/assets.txt

@@ -0,0 +1,21 @@
+#
+# This file is autogenerated by pip-compile with Python 3.8
+# by the following command:
+#
+#    make upgrade
+#
+click==8.1.5
+    # via
+    #   -c requirements/edx/../constraints.txt
+    #   -r requirements/edx/assets.in
+libsass==0.10.0
+    # via
+    #   -c requirements/edx/../constraints.txt
+    #   -r requirements/edx/assets.in
+nodeenv==1.8.0
+    # via -r requirements/edx/assets.in
+six==1.16.0
+    # via libsass
+
+# The following packages are considered to be unsafe in a requirements file:
+# setuptools

requirements/edx/base.txt

@@ -661,7 +661,9 @@ lazy==1.5
     #   ora2
     #   xblock
 libsass==0.10.0
-    # via -r requirements/edx/paver.txt
+    # via
+    #   -c requirements/edx/../constraints.txt
+    #   -r requirements/edx/paver.txt
 loremipsum==1.0.5
     # via ora2
 lti-consumer-xblock==9.5.5

requirements/edx/development.in

@@ -13,6 +13,7 @@
 -r ../pip-tools.txt                     # pip-tools and its dependencies, for managing requirements files
 -r testing.txt                          # Dependencies for running the various test suites
 -r doc.txt                              # Dependencies for building the documentation locally.
+-r assets.txt                           # Allow developers to rebuild assets with `npm run build`.
 
 click                                   # Used for perf_tests utilities in modulestore
 django-debug-toolbar                    # A set of panels that display debug information about the current request/response

requirements/edx/development.txt

@@ -214,6 +214,7 @@ click==8.1.6
     # via
     #   -c requirements/edx/../constraints.txt
     #   -r requirements/edx/../pip-tools.txt
+    #   -r requirements/edx/assets.txt
     #   -r requirements/edx/development.in
     #   -r requirements/edx/doc.txt
     #   -r requirements/edx/testing.txt
@@ -1123,6 +1124,8 @@ lazy-object-proxy==1.9.0
     #   astroid
 libsass==0.10.0
     # via
+    #   -c requirements/edx/../constraints.txt
+    #   -r requirements/edx/assets.txt
     #   -r requirements/edx/doc.txt
     #   -r requirements/edx/testing.txt
 loremipsum==1.0.5
@@ -1243,6 +1246,7 @@ nltk==3.8.1
     #   chem
 nodeenv==1.8.0
     # via
+    #   -r requirements/edx/assets.txt
     #   -r requirements/edx/doc.txt
     #   -r requirements/edx/testing.txt
 numpy==1.22.4
@@ -1803,6 +1807,7 @@ singledispatch==4.0.0
     # via -r requirements/edx/testing.txt
 six==1.16.0
     # via
+    #   -r requirements/edx/assets.txt
     #   -r requirements/edx/doc.txt
     #   -r requirements/edx/testing.txt
     #   analytics-python

requirements/edx/doc.txt

@@ -787,7 +787,9 @@ lazy==1.5
     #   ora2
     #   xblock
 libsass==0.10.0
-    # via -r requirements/edx/base.txt
+    # via
+    #   -c requirements/edx/../constraints.txt
+    #   -r requirements/edx/base.txt
 loremipsum==1.0.5
     # via
     #   -r requirements/edx/base.txt

requirements/edx/paver.in

@@ -12,7 +12,7 @@
 
 edx-opaque-keys                     # Create and introspect course and xblock identities
 lazy                                # Lazily-evaluated attributes for Python objects
-libsass==0.10.0                     # Python bindings for the LibSass CSS compiler
+libsass                             # Python bindings for the LibSass CSS compiler
 markupsafe                          # XML/HTML/XHTML Markup safe strings
 mock                                # Stub out code with mock objects and make assertions about how they have been used
 path                                # Easier manipulation of filesystem paths

requirements/edx/paver.txt

@@ -17,7 +17,9 @@ idna==3.4
 lazy==1.5
     # via -r requirements/edx/paver.in
 libsass==0.10.0
-    # via -r requirements/edx/paver.in
+    # via
+    #   -c requirements/edx/../constraints.txt
+    #   -r requirements/edx/paver.in
 markupsafe==2.1.3
     # via -r requirements/edx/paver.in
 mock==5.1.0

requirements/edx/testing.txt

@@ -854,7 +854,9 @@ lazy==1.5
 lazy-object-proxy==1.9.0
     # via astroid
 libsass==0.10.0
-    # via -r requirements/edx/base.txt
+    # via
+    #   -c requirements/edx/../constraints.txt
+    #   -r requirements/edx/base.txt
 loremipsum==1.0.5
     # via
     #   -r requirements/edx/base.txt