Socket
Socket
Sign inDemoInstall

preload-webpack-plugin

Package Overview
Dependencies
Maintainers
2
Versions
20
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

preload-webpack-plugin - npm Package Compare versions

Comparing version 3.0.0-alpha.3 to 3.0.0-beta.1

226

build/index.js

@@ -7,4 +7,2 @@ "use strict";

var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
var _set = _interopRequireDefault(require("@babel/runtime/core-js/set"));

@@ -18,6 +16,2 @@

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
/**

@@ -39,131 +33,116 @@ * @license

*/
var assert = require('assert');
const assert = require('assert');
var createHTMLElementString = require('./lib/create-html-element-string');
const createHTMLElementString = require('./lib/create-html-element-string');
var defaultOptions = require('./lib/default-options');
const defaultOptions = require('./lib/default-options');
var determineAsValue = require('./lib/determine-as-value');
const determineAsValue = require('./lib/determine-as-value');
var doesChunkBelongToHTML = require('./lib/does-chunk-belong-to-html');
const doesChunkBelongToHTML = require('./lib/does-chunk-belong-to-html');
var extractChunks = require('./lib/extract-chunks');
const extractChunks = require('./lib/extract-chunks');
var insertLinksIntoHead = require('./lib/insert-links-into-head');
const insertLinksIntoHead = require('./lib/insert-links-into-head');
var PreloadPlugin =
/*#__PURE__*/
function () {
function PreloadPlugin(options) {
(0, _classCallCheck2.default)(this, PreloadPlugin);
class PreloadPlugin {
constructor(options) {
this.options = (0, _assign.default)({}, defaultOptions, options);
}
(0, _createClass2.default)(PreloadPlugin, [{
key: "addLinks",
value: function addLinks(webpackVersion, compilation, htmlPluginData) {
var _this = this;
addLinks(webpackVersion, compilation, htmlPluginData) {
assert(webpackVersion in doesChunkBelongToHTML, `An invalid webpackVersion was supplied. Supported values: ${(0, _keys.default)(doesChunkBelongToHTML)}.`);
const options = this.options; // Bail out early if we're configured to exclude this HTML file.
assert(webpackVersion in doesChunkBelongToHTML, `An invalid webpackVersion was supplied. Supported values: ${(0, _keys.default)(doesChunkBelongToHTML)}.`);
var options = this.options; // Bail out early if we're configured to exclude this HTML file.
if (options.excludeHtmlNames.includes(htmlPluginData.plugin.options.filename)) {
return htmlPluginData;
}
if (options.excludeHtmlNames.includes(htmlPluginData.plugin.options.filename)) {
return htmlPluginData;
}
const extractedChunks = extractChunks({
compilation,
optionsInclude: options.include
});
const htmlChunks = options.include === 'allAssets' ? // Handle all chunks.
extractedChunks : // Only handle chunks imported by this HtmlWebpackPlugin.
extractedChunks.filter(chunk => doesChunkBelongToHTML[webpackVersion]({
chunk,
compilation,
htmlAssetsChunks: (0, _values.default)(htmlPluginData.assets.chunks)
})); // Flatten the list of files.
var extractedChunks = extractChunks({
compilation,
optionsInclude: options.include
});
var htmlChunks = options.include === 'allAssets' ? // Handle all chunks.
extractedChunks : // Only handle chunks imported by this HtmlWebpackPlugin.
extractedChunks.filter(function (chunk) {
return doesChunkBelongToHTML[webpackVersion]({
chunk,
compilation,
htmlAssetsChunks: (0, _values.default)(htmlPluginData.assets.chunks)
});
}); // Flatten the list of files.
const allFiles = htmlChunks.reduce((accumulated, chunk) => {
return accumulated.concat(chunk.files);
}, []);
const uniqueFiles = new _set.default(allFiles);
const filteredFiles = [...uniqueFiles].filter(file => {
return !this.options.fileWhitelist || this.options.fileWhitelist.some(regex => regex.test(file));
}).filter(file => {
return !this.options.fileBlacklist || this.options.fileBlacklist.every(regex => !regex.test(file));
}); // Sort to ensure the output is predictable.
var allFiles = htmlChunks.reduce(function (accumulated, chunk) {
return accumulated.concat(chunk.files);
}, []);
var uniqueFiles = new _set.default(allFiles);
var filteredFiles = (0, _toConsumableArray2.default)(uniqueFiles).filter(function (file) {
return !_this.options.fileWhitelist || _this.options.fileWhitelist.some(function (regex) {
return regex.test(file);
});
}).filter(function (file) {
return !_this.options.fileBlacklist || _this.options.fileBlacklist.every(function (regex) {
return !regex.test(file);
});
}); // Sort to ensure the output is predictable.
const sortedFilteredFiles = filteredFiles.sort();
const links = [];
const publicPath = compilation.outputOptions.publicPath || '';
var _iteratorNormalCompletion = true;
var _didIteratorError = false;
var _iteratorError = undefined;
var sortedFilteredFiles = filteredFiles.sort();
var links = [];
var publicPath = compilation.outputOptions.publicPath || '';
var _iteratorNormalCompletion = true;
var _didIteratorError = false;
var _iteratorError = undefined;
try {
for (var _iterator = (0, _getIterator2.default)(sortedFilteredFiles), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
const file = _step.value;
const href = `${publicPath}${file}`;
const attributes = {
href,
rel: options.rel
}; // If we're preloading this resource (as opposed to prefetching),
// then we need to set the 'as' attribute correctly.
try {
for (var _iterator = (0, _getIterator2.default)(sortedFilteredFiles), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
var file = _step.value;
var href = `${publicPath}${file}`;
var attributes = {
if (options.rel === 'preload') {
attributes.as = determineAsValue({
href,
rel: options.rel
}; // If we're preloading this resource (as opposed to prefetching),
// then we need to set the 'as' attribute correctly.
optionsAs: options.as
}); // On the off chance that we have a cross-origin 'href' attribute,
// set crossOrigin on the <link> to trigger CORS mode. Non-CORS
// fonts can't be used.
if (options.rel === 'preload') {
attributes.as = determineAsValue({
href,
optionsAs: options.as
}); // On the off chance that we have a cross-origin 'href' attribute,
// set crossOrigin on the <link> to trigger CORS mode. Non-CORS
// fonts can't be used.
if (attributes.as === 'font') {
attributes.crossorigin = '';
}
if (attributes.as === 'font') {
attributes.crossorigin = '';
}
}
var linkElementString = createHTMLElementString({
attributes,
elementName: 'link'
});
links.push(linkElementString);
const linkElementString = createHTMLElementString({
attributes,
elementName: 'link'
});
links.push(linkElementString);
}
} catch (err) {
_didIteratorError = true;
_iteratorError = err;
} finally {
try {
if (!_iteratorNormalCompletion && _iterator.return != null) {
_iterator.return();
}
} catch (err) {
_didIteratorError = true;
_iteratorError = err;
} finally {
try {
if (!_iteratorNormalCompletion && _iterator.return != null) {
_iterator.return();
}
} finally {
if (_didIteratorError) {
throw _iteratorError;
}
if (_didIteratorError) {
throw _iteratorError;
}
}
htmlPluginData.html = insertLinksIntoHead({
links,
html: htmlPluginData.html
});
return htmlPluginData;
}
}, {
key: "apply",
value: function apply(compiler) {
var _this2 = this;
if ('hooks' in compiler) {
compiler.hooks.compilation.tap(this.constructor.name, function (compilation) {
compilation.hooks.htmlWebpackPluginBeforeHtmlProcessing.tapAsync(_this2.constructor.name, function (htmlPluginData, callback) {
htmlPluginData.html = insertLinksIntoHead({
links,
html: htmlPluginData.html
});
return htmlPluginData;
}
apply(compiler) {
if ('hooks' in compiler) {
compiler.hooks.compilation.tap(this.constructor.name, compilation => {
if ('htmlWebpackPluginBeforeHtmlProcessing' in compilation.hooks) {
compilation.hooks.htmlWebpackPluginBeforeHtmlProcessing.tapAsync(this.constructor.name, (htmlPluginData, callback) => {
try {
callback(null, _this2.addLinks('v4', compilation, htmlPluginData));
callback(null, this.addLinks('v4', compilation, htmlPluginData));
} catch (error) {

@@ -173,19 +152,22 @@ callback(error);

});
} else {
const error = new Error(`Unable to tap into the ` + `HtmlWebpackPlugin's callbacks. Make sure to list ` + `${this.constructor.name} at some point after ` + `HtmlWebpackPlugin in webpack's plugins array.`);
compilation.errors.push(error);
}
});
} else {
compiler.plugin('compilation', compilation => {
compilation.plugin('html-webpack-plugin-before-html-processing', (htmlPluginData, callback) => {
try {
callback(null, this.addLinks('v3', compilation, htmlPluginData));
} catch (error) {
callback(error);
}
});
} else {
compiler.plugin('compilation', function (compilation) {
compilation.plugin('html-webpack-plugin-before-html-processing', function (htmlPluginData, callback) {
try {
callback(null, _this2.addLinks('v3', compilation, htmlPluginData));
} catch (error) {
callback(error);
}
});
});
}
});
}
}]);
return PreloadPlugin;
}();
}
}
module.exports = PreloadPlugin;

23

build/lib/create-html-element-string.js

@@ -29,13 +29,12 @@ "use strict";

*/
var assert = require('assert');
const assert = require('assert');
function createHTMLElementString(_ref) {
var elementName = _ref.elementName,
_ref$attributes = _ref.attributes,
attributes = _ref$attributes === void 0 ? {} : _ref$attributes,
_ref$closingTagRequir = _ref.closingTagRequired,
closingTagRequired = _ref$closingTagRequir === void 0 ? false : _ref$closingTagRequir;
function createHTMLElementString({
elementName,
attributes = {},
closingTagRequired = false
}) {
assert(elementName, 'Please provide an element name.');
assert(!/\W/.test(elementName), 'The element name contains invalid characters.');
var attributeStrings = [];
const attributeStrings = [];
var _iteratorNormalCompletion = true;

@@ -47,5 +46,5 @@ var _didIteratorError = false;

for (var _iterator = (0, _getIterator2.default)((0, _entries.default)(attributes).sort()), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
var _step$value = (0, _slicedToArray2.default)(_step.value, 2),
attributeName = _step$value[0],
attributeValue = _step$value[1];
const _step$value = (0, _slicedToArray2.default)(_step.value, 2),
attributeName = _step$value[0],
attributeValue = _step$value[1];

@@ -73,3 +72,3 @@ if (attributeValue === '') {

var elementString = `<${elementName}`;
let elementString = `<${elementName}`;

@@ -76,0 +75,0 @@ if (attributeStrings.length > 0) {

2

build/lib/default-options.js

@@ -19,3 +19,3 @@ "use strict";

*/
var defaultOptions = {
const defaultOptions = {
rel: 'preload',

@@ -22,0 +22,0 @@ include: 'asyncChunks',

19

build/lib/determine-as-value.js

@@ -19,12 +19,13 @@ "use strict";

*/
var assert = require('assert');
const assert = require('assert');
var path = require('path');
const path = require('path'); // The first-party 'url' module isn't available in node 6.
var _require = require('url'),
URL = _require.URL;
function determineAsValue(_ref) {
var optionsAs = _ref.optionsAs,
href = _ref.href;
const URL = require('url-parse');
function determineAsValue({
optionsAs,
href
}) {
assert(href, `The 'href' parameter was not provided.`);

@@ -48,4 +49,4 @@

// We only care about the pathname, so just use any domain when constructing the URL.
var url = new URL(href, 'https://example.com');
var extension = path.extname(url.pathname);
const url = new URL(href, 'https://example.com');
const extension = path.extname(url.pathname);

@@ -52,0 +53,0 @@ if (extension === '.css') {

51

build/lib/does-chunk-belong-to-html.js

@@ -29,8 +29,7 @@ "use strict";

*/
function v3(_ref) {
var chunk = _ref.chunk,
htmlAssetsChunks = _ref.htmlAssetsChunks,
_ref$visitedChunks = _ref.visitedChunks,
visitedChunks = _ref$visitedChunks === void 0 ? {} : _ref$visitedChunks;
function v3({
chunk,
htmlAssetsChunks,
visitedChunks = {}
}) {
// Prevent circular recursion.

@@ -49,3 +48,3 @@ // See https://github.com/GoogleChromeLabs/preload-webpack-plugin/issues/49

for (var _iterator = (0, _getIterator2.default)(htmlAssetsChunks), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
var htmlAssetChunk = _step.value;
const htmlAssetChunk = _step.value;

@@ -77,3 +76,3 @@ if (htmlAssetChunk.hash === chunk.renderedHash) {

for (var _iterator2 = (0, _getIterator2.default)(chunk.parents), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {
var parent = _step2.value;
const parent = _step2.value;

@@ -106,28 +105,24 @@ if (v3({

function v4(_ref2) {
var chunk = _ref2.chunk,
htmlAssetsChunks = _ref2.htmlAssetsChunks,
compilation = _ref2.compilation;
function v4({
chunk,
htmlAssetsChunks,
compilation
}) {
// Get all the hashes of the HTML assets.
var rootHashes = (0, _values.default)(htmlAssetsChunks).map(function (_ref3) {
var hash = _ref3.hash;
return hash;
}); // Get a list of chunk groups that contain one of those hashes.
const rootHashes = (0, _values.default)(htmlAssetsChunks).map(({
hash
}) => hash); // Get a list of chunk groups that contain one of those hashes.
var rootChunkGroups = compilation.chunkGroups.filter(function (chunkGroup) {
return chunkGroup.chunks.filter(function (chunk) {
return rootHashes.includes(chunk.renderedHash);
});
const rootChunkGroups = compilation.chunkGroups.filter(chunkGroup => {
return chunkGroup.chunks.filter(chunk => rootHashes.includes(chunk.renderedHash));
}); // Get an id for each of those chunk groups.
var rootChunkGroupsIds = new _set.default(rootChunkGroups.map(function (_ref4) {
var id = _ref4.id;
return id;
})); // Return true iff the chunk we're passed belongs to a group whose id is in
const rootChunkGroupsIds = new _set.default(rootChunkGroups.map(({
id
}) => id)); // Return true iff the chunk we're passed belongs to a group whose id is in
// the list of root chunk groups.
return (0, _from.default)(chunk.groupsIterable).some(function (_ref5) {
var id = _ref5.id;
return rootChunkGroupsIds.has(id);
});
return (0, _from.default)(chunk.groupsIterable).some(({
id
}) => rootChunkGroupsIds.has(id));
}

@@ -134,0 +129,0 @@

18

build/lib/extract-chunks.js

@@ -23,13 +23,13 @@ "use strict";

*/
function extractChunks(_ref) {
var compilation = _ref.compilation,
optionsInclude = _ref.optionsInclude;
function extractChunks({
compilation,
optionsInclude
}) {
try {
// 'asyncChunks' are chunks intended for lazy/async loading usually generated as
// part of code-splitting with import() or require.ensure(). By default, asyncChunks
// get wired up using link rel=preload when using this plugin. This behaviour can be
// get wired up using link rel=preload when using this plugin. This behavior can be
// configured to preload all types of chunks or just prefetch chunks as needed.
if (optionsInclude === undefined || optionsInclude === 'asyncChunks') {
return compilation.chunks.filter(function (chunk) {
return compilation.chunks.filter(chunk => {
if ('canBeInitial' in chunk) {

@@ -44,3 +44,3 @@ return !chunk.canBeInitial();

if (optionsInclude === 'initial') {
return compilation.chunks.filter(function (chunk) {
return compilation.chunks.filter(chunk => {
if ('canBeInitial' in chunk) {

@@ -69,5 +69,3 @@ return chunk.canBeInitial();

// Keep only user specified chunks.
return compilation.chunks.filter(function (chunk) {
return chunk.name && optionsInclude.includes(chunk.name);
});
return compilation.chunks.filter(chunk => chunk.name && optionsInclude.includes(chunk.name));
}

@@ -74,0 +72,0 @@ } catch (error) {

13

build/lib/insert-links-into-head.js

@@ -19,7 +19,6 @@ "use strict";

*/
function insertLinksIntoHead(_ref) {
var html = _ref.html,
_ref$links = _ref.links,
links = _ref$links === void 0 ? [] : _ref$links;
function insertLinksIntoHead({
html,
links = []
}) {
if (links.length === 0) {

@@ -31,3 +30,3 @@ return html;

// If a valid closing </head> is found, insert the new <link>s right before it.
return html.replace('</head>', links.join('\n') + '\n</head>');
return html.replace('</head>', links.join('') + '</head>');
}

@@ -37,3 +36,3 @@

// If there's a <body> but no <head>, create a <head> containing the <head>.
return html.replace('<body>', `<head>\n${links.join('\n')}\n</head>\n<body>`);
return html.replace('<body>', `<head>${links.join('')}\n</head><body>`);
}

@@ -40,0 +39,0 @@

19

package.json
{
"name": "preload-webpack-plugin",
"version": "3.0.0-alpha.3",
"version": "3.0.0-beta.1",
"description": "A webpack plugin for injecting <link rel='preload|prefecth'> into HtmlWebpackPlugin pages, with async chunk support",

@@ -24,3 +24,3 @@ "author": "Addy Osmani <addy.osmani@gmail.com> (https://github.com/addyosmani)",

"engines": {
"node": ">=4.0.0"
"node": ">=6.0.0"
},

@@ -41,12 +41,12 @@ "scripts": {

"devDependencies": {
"@babel/cli": "^7.0.0-beta.44",
"@babel/core": "^7.0.0-beta.44",
"@babel/plugin-transform-runtime": "^7.0.0-beta.44",
"@babel/preset-env": "^7.0.0-beta.44",
"@babel/cli": "^7.0.0-beta.49",
"@babel/core": "^7.0.0-beta.49",
"@babel/plugin-transform-runtime": "^7.0.0-beta.49",
"@babel/preset-env": "^7.0.0-beta.49",
"eslint": "^4.19.1",
"eslint-config-google": "^0.9.1",
"jasmine": "^3.1.0",
"jsdom": "^11.7.0",
"jsdom": "^11.11.0",
"memory-fs": "^0.4.1",
"nyc": "^11.6.0",
"nyc": "^12.0.2",
"rimraf": "^2.6.2"

@@ -59,4 +59,5 @@ },

"dependencies": {
"@babel/runtime": "^7.0.0-beta.44"
"@babel/runtime": "^7.0.0-beta.49",
"url-parse": "^1.4.1"
}
}

101

README.md

@@ -1,3 +0,3 @@

preload-webpack-plugin
============
# preload-webpack-plugin
[![NPM version][npm-img]][npm-url]

@@ -9,14 +9,10 @@ [![NPM downloads][npm-downloads-img]][npm-url]

A Webpack plugin for automatically wiring up asynchronous (and other types) of JavaScript
A webpack plugin for automatically wiring up asynchronous (and other types) of JavaScript
chunks using `<link rel='preload'>`. This helps with lazy-loading.
Note: This is an extension plugin for [html-webpack-plugin](https://github.com/ampedandwired/html-webpack-plugin) - a plugin that
Note: This is an extension plugin for [`html-webpack-plugin`](https://github.com/jantimon/html-webpack-plugin) - a plugin that
simplifies the creation of HTML files to serve your webpack bundles.
This plugin is a stop-gap until we add support for asynchronous chunk wiring to
[script-ext-html-webpack-plugin](https://github.com/numical/script-ext-html-webpack-plugin/pull/9).
## Introduction
Introduction
------------
[Preload](https://w3c.github.io/preload/) is a web standard aimed at improving performance

@@ -37,12 +33,11 @@ and granular loading of resources. It is a declarative fetch that can tell a browser to start fetching a

Pre-requisites
--------------
This module requires Webpack 2.2.0 and above. It also requires that you're using
[html-webpack-plugin](https://github.com/ampedandwired/html-webpack-plugin) in your Webpack project.
## Prerequisites
Installation
---------------
This module requires webpack 2.2.0 and above. It also requires that you're using
[`html-webpack-plugin`](https://github.com/ampedandwired/html-webpack-plugin) in your webpack project.
First, install the package as a dependency in your package.json:
## Installation
First, install the package as a dependency in your `package.json`:
```sh

@@ -52,12 +47,11 @@ $ npm install --save-dev preload-webpack-plugin

Alternatively, using yarn:
Alternatively, using `yarn`:
```sh
yarn add -D preload-webpack-plugin
$ yarn add -D preload-webpack-plugin
```
Usage
-----------------
## Usage
Next, in your Webpack config, `require()` the preload plugin as follows:
In your webpack config, `require()` the preload plugin as follows:

@@ -68,3 +62,3 @@ ```js

and finally, configure the plugin in your Webpack `plugins` array after `HtmlWebpackPlugin`:
and finally, configure the plugin in your webpack `plugins` array after `HtmlWebpackPlugin`:

@@ -152,2 +146,3 @@ ```js

In case you work with named chunks, you can explicitly specify which ones to `include` by passing an array:
```js

@@ -169,4 +164,3 @@ plugins: [

Filtering chunks
---------------------
### Filtering chunks

@@ -189,4 +183,3 @@ There may be chunks that you don't want to have preloaded (sourcemaps, for example). Before preloading each chunk, this plugin checks that the file does not match any regex in the `fileBlacklist` option. The default value of this blacklist is `[/\.map/]`, meaning no sourcemaps will be preloaded. You can easily override this:

Resource Hints
---------------------
### Resource Hints

@@ -213,4 +206,3 @@ Should you wish to use Resource Hints (such as `prefetch`) instead of `preload`, this plugin also supports wiring those up.

Demo
----------------------
## Demo

@@ -220,7 +212,5 @@ A demo application implementing the [PRPL pattern](https://developers.google.com/web/fundamentals/performance/prpl-pattern/) with React that uses this plugin can be found in the `demo`

Support
-------
## Support
If you've found an error in this sample, please file an issue:
[https://github.com/googlechrome/preload-webpack-plugin/issues](https://github.com/googlechrome/preload-webpack-plugin/issues)
If you've found an error or run into problems, please [file an issue](https://github.com/googlechrome/preload-webpack-plugin/issues).

@@ -230,6 +220,6 @@ Patches are encouraged, and may be submitted by forking this project and

Contributing workflow
---------------------
## Contributing workflow
`index.js` contains the primary source for the plugin, `test` contains tests and `demo` contains demo code.
[`src/index.js`](src/index.js) and [`src/lib/`](src/lib/) contains the primary source for the plugin.
[`test/`](test/) contains tests and [`demo/`](demo/) contains demo code.

@@ -243,32 +233,31 @@ Test the plugin:

Lint the plugin:
The project is written in ES2015, and is transpiled to support node 6 and above.
```sh
$ npm run lint
$ npm run lint-fix # fix linting issues
```
## Additional notes
The project is written in ES2015, but does not use a build-step. This may change depending on
any Node version support requests posted to the issue tracker.
Additional Notes
---------------------------
* Be careful not to `preload` resources a user is unlikely to need. This can waste their bandwidth.
* Use `preload` for the current session if you think a user is likely to visit the next page. There is no
- Be careful not to `preload` resources a user is unlikely to need. This can waste their bandwidth.
- Use `preload` for the current session if you think a user is likely to visit the next page. There is no
100% guarantee preloaded items will end up in the HTTP Cache and read locally beyond this session.
* If optimising for future sessions, use `prefetch` and `preconnect`. Prefetched resources are maintained
- If optimizing for future sessions, use `prefetch` and `preconnect`. Prefetched resources are maintained
in the HTTP Cache for at least 5 minutes (in Chrome) regardless of the resource's cachability.
Related plugins
--------------------------
## Alternative tools
* [script-ext-html-webpack-plugin](https://github.com/numical/script-ext-html-webpack-plugin) - Enhances html-webpack-plugin with options including 'async', 'defer', 'module' and preload (no async chunk support yet)
* [resource-hints-webpack-plugin](https://github.com/jantimon/resource-hints-webpack-plugin) - Automatically wires resource hints for your resources (similarly no async chunk support)
- webpack's native support:
As of the [v4.6.0 release](https://github.com/webpack/webpack/releases/tag/v4.6.0)
of webpack, there is native support for generating both prefetch and preload `<link>`s via ["magic" comments in your `import()` statements](https://medium.com/webpack/link-rel-prefetch-preload-in-webpack-51a52358f84c).
License
-------
- [script-ext-html-webpack-plugin](https://github.com/numical/script-ext-html-webpack-plugin):
Enhances `html-webpack-plugin` with options including 'async', 'defer', 'module' and 'preload'.
As of [v1.7.0](https://github.com/numical/script-ext-html-webpack-plugin/pull/9#issuecomment-278239875),
it supports async chunks.
Copyright 2017 Google, Inc.
- [resource-hints-webpack-plugin](https://github.com/jantimon/resource-hints-webpack-plugin):
Automatically wires resource hints for your resources. This plugin does does not currently
support async chunks.
## License
Copyright 2018 Google, Inc.
Licensed to the Apache Software Foundation (ASF) under one or more contributor

@@ -275,0 +264,0 @@ license agreements. See the NOTICE file distributed with this work for

LICENSE

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc