npmpackage.info

Gathering detailed insights and metrics for twig-asset-webpack-plugin

Other packages similar to twig-asset-webpack-plugin

@pixolith/webpack-twig-assets-emitter-plugin

10.0.0

## How to use

Gathering detailed insights and metrics for twig-asset-webpack-plugin

twig-asset-webpack-plugin - 2.0.0 | npmpackage.info

twig-asset-webpack-plugin

Webpack 5 plugin to add assets referenced in twig files to the compilation as additional assets.

2.0.0

MIT

TypeScript

20.33 kB

2.5

Installations

npm install twig-asset-webpack-plugin

Developer Guide

BETA

Typescript

Yes

Module System

CommonJS

Min. Node Version

>= 12

Node Version

16.10.0

NPM Version

7.24.0 Pull Requests

Open

4

Total

16

Closed

6

Merged

6

Issues

Open

0

Total

0

Closed

0

Releases

v2.0.0

Updated on Oct 22, 2021

1.1.0

Updated on May 08, 2021

1.0.3

Updated on Nov 25, 2020

Initial release

1.0.0

Updated on Mar 13, 2019

View All 4 releases

Languages

TypeScript

TypeScript (100%)

Developer

erik-perri

Download Statistics

Total Downloads

Last Day

Last Week

Last Month

Last Year

GitHub Statistics

MIT License

1 Stars

64 Commits

1 Forks

1 Watchers

6 Branches

1 Contributors

Updated on Apr 19, 2023

Maintainers

View All 1 Contributors

Package Meta Information

Latest Version

2.0.0

Package Id

twig-asset-webpack-plugin@2.0.0

Unpacked Size

20.33 kB

Size

6.08 kB

File Count

NPM Version

7.24.0

Node Version

16.10.0

Total Downloads

Cumulative downloads

Total Downloads

NaN

Last Day

NaN

Compared to previous day

Last Week

NaN

Compared to previous week

Last Month

NaN

Compared to previous month

Last Year

NaN

Compared to previous year

Weekly Downloads

Monthly Downloads

Yearly Downloads

Twig Asset Webpack Plugin

Webpack 5 plugin to add assets referenced in Twig files to the compilation. This puts them in the generated manifest, so they are available when Twig looks for them.

For example, if it comes across <img src="{{ asset('images/test.png') }}" /> in a Twig file (assuming the configuration below), the plugin would look for <project-dir>/assets/images/test.png. If the file is found, it is added to the Webpack compilation process, copied to the output, and added to the manifest generated by WebpackManifestPlugin.

Install

1npm install --save-dev twig-asset-webpack-plugin

1yarn add --dev twig-asset-webpack-plugin

Usage

In your webpack.config.js

1const path = require('path');
2const { TwigAssetWebpackPlugin } = require('twig-asset-webpack-plugin');
3
4module.exports = {
5    // ...
6    plugins: [
7        new TwigAssetWebpackPlugin({
8            assetPath: path.resolve(__dirname, './assets'),
9            templatePath: path.resolve(__dirname, './templates'),
10        }),
11    ]
12};

When webpack compiles it will now scan templatePath for Twig files with asset references. It will then add each reference to the Webpack compilation process.

Usage with Symfony Encore

In your webpack.config.js

1const path = require('path');
2const { TwigAssetWebpackPlugin } = require('twig-asset-webpack-plugin');
3
4Encore
5    // ...
6    // We need to remove the default build prefix from the manifest or
7    // when twig attempts to load the asset it will not find it.
8    .setManifestKeyPrefix('')
9    // ...
10    .addPlugin(
11        new TwigAssetWebpackPlugin({
12            assetPath: path.resolve(__dirname, './assets'),
13            templatePath: path.resolve(__dirname, './templates'),
14        })
15    )
16;

TwigAssetWebpackPlugin API:

`options.assetPath` (Required)

Type: String Default: undefined

The absolute path to load asset files from. The asset reference in the Twig template should be relative to this path.

`options.templatePath` (Required*)

Type: String Default: undefined

The absolute path to search for Twig files in. This should be undefined if assetLocator is set manually.

`options.assetLocator`

Type: AssetLocatorInterface Default: undefined

The locator used to find Twig files. If templatePath is specified and this is not, an AssetLocator instance will be created with the default options.

`options.filename`

Type: String Default: undefined

The output filename format. It must end in .[ext] if specified. If not specified the webpack output.filename option will be used (the extension will automatically be replaced with .[ext]).

AssetLocator API:

`options.fileMatch`

Type: RegExp Default: /\.html\.twig$/

The template file names matching this will be searched for asset references.

`options.assetMatch`

Type: RegExp Default: /asset$(['"])((?!\1).+)\1$/g

The regex to use searching for assets in Twig files.

`options.assetMatchIndex`

Type: Number Default: 2

The index to pull the file name from the assetMatch match.

`options.excludedMatches`

Type: RegExp[] Default: [/node_modules/]

The template file or directory names matching this will be excluded from processing.

License

MIT

No vulnerabilities found.

10

Dangerous-Workflow

Determines if the project's GitHub Action workflows avoid dangerous patterns.

10

Binary-Artifacts

Determines if the project has generated executable (binary) artifacts in the source repository.

10

License

Determines if the project has defined a license.

0

Code-Review

Determines if the project requires human code review before pull requests (aka merge requests) are merged.

0

Maintained

Determines if the project is "actively maintained".

0

Token-Permissions

Determines if the project's workflows follow the principle of least privilege.

0

CII-Best-Practices

Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.

0

Pinned-Dependencies

Determines if the project has declared and pinned the dependencies of its build process.

0

Security-Policy

Determines if the project has published a security policy.

0

Fuzzing

Determines if the project uses fuzzing.

0

Branch-Protection

Determines if the default and release branches are protected with GitHub's branch protection settings.

0

SAST

Determines if the project uses static code analysis.

0

Vulnerabilities

Determines if the project has open, known unfixed vulnerabilities.

Score

2.5

/10

Last Scanned on 2025-07-07

The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.

Learn More

Other packages similar to twig-asset-webpack-plugin

Other packages similar to twig-asset-webpack-plugin

twig-asset-webpack-plugin

Installations

Developer Guide

Yes

CommonJS

>= 12

16.10.0

7.24.0

Pull Requests

4

16

6

6

Issues

0

0

0

Releases

Languages

Developer

erik-perri

Download Statistics

GitHub Statistics

Maintainers

Package Meta Information

Total Downloads

NaN

Weekly Downloads

Monthly Downloads

Yearly Downloads

Dependencies

Dev Dependencies

Twig Asset Webpack Plugin

Install

Usage

Usage with Symfony Encore

TwigAssetWebpackPlugin API:

options.assetPath (Required)

options.templatePath (Required*)

options.assetLocator

options.filename

AssetLocator API:

options.fileMatch

options.assetMatch

options.assetMatchIndex

options.excludedMatches

License

10

10

10

0

0

0

0

0

0

0

0

0

0

2.5

/10

`options.assetPath` (Required)

`options.templatePath` (Required*)

`options.assetLocator`

`options.filename`

`options.fileMatch`

`options.assetMatch`

`options.assetMatchIndex`

`options.excludedMatches`