Files
Fuchs_Intranet/.github/instructions/javascript.instructions.md
T

75 lines
2.3 KiB
Markdown

# JavaScript Instructions
## General Rules
- **Never edit files inside `wwwroot/` directly.** All JS output files are generated by the Gulp build pipeline.
- After adding or modifying JS source files, ensure they are listed in `Fuchs/bdlconfig.json` under the correct bundle and context.
## Source File Locations
| Type | Path |
|------|------|
| Core intranet JS | `Fuchs/js/intranet/` |
| Feature module JS | `Fuchs/js/intranet/modules/<module>/` |
## Bundle Contexts
Each bundle in `bdlconfig.json` has a `context` field that determines which page(s) load it:
| Context | Loaded on |
|---------|-----------|
| `intranet` | All intranet pages |
| `intranet:inv` | Invoices module only |
| `intranet:req` | Requests module only |
| `intranet:rep` | Reports module only |
| `intranet:bam` | BAM module only |
## Adding a JS File to a Bundle
Locate the correct bundle entry in `Fuchs/bdlconfig.json` by matching the `context` and `outputFileName`, then add the source path to `inputFiles`:
```json
{
"context": "intranet:inv",
"outputFileName": "web/fis.inv.de.js",
"inputFiles": [
"js/intranet/modules/invoices/invoices.js",
"js/intranet/modules/invoices/your-new-file.js"
],
"minify": { "enabled": true }
}
```
Files listed in `inputFiles_tominify` are minified individually before concatenation (use for third-party scripts that should be minified separately).
## Adding a New Module
1. Create `Fuchs/js/intranet/modules/<module>/<module>.js`.
2. If the module needs styles, create `Fuchs/js/intranet/modules/<module>/<module>.scss`.
3. Add both files to the appropriate bundle entries in `bdlconfig.json`.
4. Run `npx gulp all` from the `Fuchs/` directory to rebuild.
## npm Packages
Use packages already declared in `Fuchs/package.json` where possible. Available runtime packages:
| Package | Global / Usage |
|---------|----------------|
| `jquery` | DOM, AJAX |
| `js-cookie` | Cookie read/write |
| `fg-loadcss` | Async CSS loading |
| `tinymce` | Rich text editor |
Do not import npm packages directly in source files — they are copied to `web/` by `gulp copy` and referenced via bundle entries in `bdlconfig.json`.
## Build Commands
Run from the `Fuchs/` directory:
```powershell
cd Fuchs
npx gulp min:js # rebuild JS bundles only
npx gulp all # full rebuild (JS + CSS + copy)
```