Easy webpack builds
npm install --save-dev @djx/webpack
To use webpack you create a
webpack.config.ts that looks like this:
;;input: 'scripts/index.ts'output: 'public/dist/app.js'injectors:injectorsinjectorsinjectors;
Then you can just tell the webpack cli to use this config:
webpack --mode 'production' --config webpack.config.ts
Injectors define specific behaviors. To use them you simply attach them in your config:
scss imports for LitElement a more sophisticated setup is required.
This injector simplifies the process by combining all the different options and loaders in a single unit. This workflow creates the necessity for "sassDependencies", since SCSS files are now shipped with the package. This means you have to tell webpack in your compiler which scss files to include in advance. You do this by exposing them in your
package.json like this:
"sassDependencies":/** Search inside modules **/"~@djx/scss/mixins/fluid-size.scss"/** Use internal dependencies **/"./lib/vars.scss"
~prefix tells the compiler to search inside node_modules only
Just a simple typescript loader with some options.
A simple SCSS compiler. Nothing special about it.
webpack-dev-server if used.
Configure glslify to import shaders (.glsl, .vert, .frag):
To use ES6 imports with typescript include this in your declerations
Configure pug templates with pages as entrypoints:
Copy files to the dist and dev build: