Can create a project with webpack bundled typescript support

[a-musing-moose]

Adds optional static assets build pipeline using webpack as a bundler. Linting and formatting is provided by Prettier and the Ackama ESLint configuration.

If Typescript support is requests, the optional use of HTMX can also be turned on which will include htmx in the standard asset bundle as well as django-htmx for backend support.

[nzlaura]

Overall I think this is looking good- a few comments on the prettier set up + npm run commands to start 😄

[G-Rath]

this looks like a good start, but we're missing

• the ESLint config (which'll reveal some other missing config and dependency stuff)
• running type checking across the codebase
  • it's not sufficient to do type checking through ts-loader because that only checks files it imports

[G-Rath]

note/suggestion: I'm guessing you're relying on ts-loader to execute the actual type checking

I don't think that's the end of the world, but I would suggest in the long-run splitting them out because it means you don't have to spend time typechecking when building e.g. for deployments, and it makes it easier to iterate because you can still use the app even if your types are not perfect

generally we use Babel for compiling instead

[a-musing-moose]

There is now a npm run typecheck which should cover everything.

My understanding is that babel is faster because it strips types whereas ts-loader uses TSC and will therefore fail if there are typing errors. Otherwise they do pretty much the same thing. I'm more concerned about correct code than compilation times here as the amount of TS is tiny. But happy to conform with other project if you consider it important.

[G-Rath]

issue: the command is npm ci, and the webpack config has been renamed to .ts

also you can copy the configs after installing

Suggested change

	COPY webpack.config.js tsconfig.json package.json package-lock.json /source/
	WORKDIR /source
	RUN npm cli
	COPY src/assets /source/src/assets/
	RUN npm run build
	COPY package.json package-lock.json /source/
	WORKDIR /source
	RUN npm ci
	COPY webpack.config.ts tsconfig.json /source
	COPY src/assets /source/src/assets/
	RUN npm run build

[a-musing-moose]

Thanks - is the delayed copy to make better use of docker layer caching or is there another reason?

[G-Rath]

suggestion: node_modules is already ignored by our shared config

Also happy to add .venv to that list (we could also add htmlcov, though conventionally all our other tools use coverage which is already ignored, so might be worth discussing going the other way on that)

Suggested change

	'.venv/*',
	'htmlcov/*',
	'node_modules/*',
	'src/{{ project_module }}/static/assets/*'
	'.venv/*',
	'htmlcov/*',
	'src/{{ project_module }}/static/assets/*'

[a-musing-moose]

I've removed node_modules but left the others in. Should you add .venv and htmlcov to the shared config I'll remove.

htmlcov in particular is the folder in which the human readable coverage report is generated. This is the default for the Python coverage tool.

It keeps the actual coverage data in a binary .coverage file. We also product a coverage.xml for CI integration which always seems to want Cobertura XML files.