- Notifications
You must be signed in to change notification settings - Fork4
A html webpack plugin for injecting <link rel='preload'>
License
NotificationsYou must be signed in to change notification settings
principalstudio/html-webpack-inject-preload
Folders and files
Name | Name | Last commit message | Last commit date | |
---|---|---|---|---|
Repository files navigation
AHTML Webpack Plugin for injecting<link rel='preload'>
This plugin allows to add preload links anywhere you want.
You need to have HTMLWebpackPlugin v4 or v5 to make this plugin work.
npm i -D @principalstudio/html-webpack-inject-preload
webpack.config.js
constHtmlWebpackPlugin=require('html-webpack-plugin');constHtmlWebpackInjectPreload=require('@principalstudio/html-webpack-inject-preload');module.exports={entry:'index.js',output:{path:__dirname+'/dist',filename:'index_bundle.js'},plugins:[newHtmlWebpackPlugin(),newHtmlWebpackInjectPreload({files:[{match:/.*\.woff2$/,attributes:{as:'font',type:'font/woff2',crossorigin:true},},{match:/vendors\.[a-z-0-9]*.css$/,attributes:{as:'style'},},]})]}
Options
- files: An array of files object
- match: A regular expression to target files you want to preload
- attributes: Any attributes you want to use. The plugin will add the attribute
rel="preload"
by default.
Usage
The plugin is really simple to use. The plugin injects inheadTags
, before any link, the preload elements.
For example
<!DOCTYPE html><html><head><metacharset="utf-8"><title>Webpack App</title><%= htmlWebpackPlugin.tags.headTags %></head><body><scriptsrc="index_bundle.js"></script></body></html>
will generate
<!DOCTYPE html><html><head><metacharset="utf-8"><title>Webpack App</title><linkhref="dist/fonts/font.woff2"rel="preload"type="font/woff2"crossorigin><linkhref="dist/css/main.css"></head><body><scriptsrc="index_bundle.js"></script></body></html>
About
A html webpack plugin for injecting <link rel='preload'>
Resources
License
Uh oh!
There was an error while loading.Please reload this page.
Stars
Watchers
Forks
Packages0
Uh oh!
There was an error while loading.Please reload this page.