Skip to content

Support lazy loaded and custom named scripts/styles #3401

Closed
@filipesilva

Description

@filipesilva

Add support for outputting lazy loaded styles and scripts, and also to rename these. Global css should always be outputted as a CSS file, with no accompanying .js bundle.

Example configuration in angular-cli.json:

      "styles": [
        "styles.css",
        { "input": "named-style.scss" },
        { "input": "lazy-style.scss", "lazy": true },
        { "input": "pre-rename-style.scss", "output": "renamed-style" },
        { "input": "pre-rename-lazy-style.scss", "output": "renamed-lazy-style", "lazy": true },
        { "input": "common-entry.scss", "output": "common-entry" }
      ],
      "scripts": [
        "scripts.js",
        { "input": "named-script.js" },
        { "input": "lazy-script.js", "lazy": true },
        { "input": "pre-rename-script.js", "output": "renamed-script" },
        { "input": "pre-rename-lazy-script.js", "output": "renamed-lazy-script", "lazy": true },
        { "input": "common-entry.js", "output": "common-entry" }
      ],

This should output the following list of files inside dist/:

styles.css
named-style.css
lazy-style.css // not loaded in index.html
renamed-style.css
renamed-lazy-style.css // not loaded in index.html
common-entry.css
scripts.js
named-script.js
lazy-script.js // not loaded in index.html
renamed-script.js
renamed-lazy-script.js // not loaded in index.html
common-entry.js

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions