# html-webpack-cdn-plugin

> cdn in webpack

Latest version **0.2.0** (published 2017-03-01) · GPL license · 0 weekly downloads

## Install

```sh
npm install html-webpack-cdn-plugin
pnpm add html-webpack-cdn-plugin
yarn add html-webpack-cdn-plugin
bun add html-webpack-cdn-plugin
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.2.0 |
| Published | 2017-03-01 |
| First published | 2016-09-11 |
| Weekly downloads | 0 |
| License | GPL |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 3 |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| GitHub stars | 27 |
| Author | jso0 |
| Maintainers | jso0 |
| Keywords | webpack, cdn-loader, webpack-plugin, html-webpack-plugin, html-webpack-cdn-plugin |

## Links

- npm: https://www.npmjs.com/package/html-webpack-cdn-plugin
- Repository: https://github.com/jso0/html-webpack-cdn-plugin
- Issues: https://github.com/jso0/html-webpack-cdn-plugin/issues
- npm.io page: https://npm.io/package/html-webpack-cdn-plugin

## Dependencies (3)

- [cdn-loader](https://npm.io/package/cdn-loader.md) ^0.1.1
- [loader-utils](https://npm.io/package/loader-utils.md) ^0.2.15
- [html-webpack-plugin](https://npm.io/package/html-webpack-plugin.md) ^2.22.0

## Alternatives

- [@tsparticles/shape-image](https://npm.io/package/@tsparticles/shape-image.md) — 303.7K weekly downloads
- [@tsparticles/shape-line](https://npm.io/package/@tsparticles/shape-line.md) — 233.7K weekly downloads
- [stringify-attributes](https://npm.io/package/stringify-attributes.md) — 58.6K weekly downloads
- [mobile-drag-drop](https://npm.io/package/mobile-drag-drop.md) — 46.3K weekly downloads
- [@comunica/actor-rdf-parse-html](https://npm.io/package/@comunica/actor-rdf-parse-html.md) — 29.2K weekly downloads

## Recent versions

- 0.2.0 (latest) — 2017-03-01
- 0.1.10 — 2016-09-11
- 0.1.9 — 2016-09-11
- 0.1.8 — 2016-09-11
- 0.1.7 — 2016-09-11
- 0.1.6 — 2016-09-11
- 0.1.5 — 2016-09-11
- 0.1.4 — 2016-09-11
- 0.1.1 — 2016-09-11
- 0.1.0 — 2016-09-11

## README

# Html-webpack-cdn-plugin

> cdn in webpack

## Useage

### Dependencies
> cdn-loader
> **You NEAD Install `cdn-loader` and `html-webpack-plugin`**

### Install

1. Run `npm i -D html-webpack-cdn-plugin` in your project folder
2. Add `var HtmlWebpackCdnPlugin = require('html-webpack-cdn-plugin')` to  `webpack.config.js` file
3. Add `new HtmlWebpackCdnPlugin(config)` to  `webpack.config.js` file (`plugins`)
4. Also you need  [cdn-loader](https://github.com/jso0/cdn-loader) and [html-webpack-plugin](https://github.com/ampedandwired/html-webpack-plugin)

### Support

css and js files [https://cdnjs.com](https://cdnjs.com)

## Config

### Example

``` javascript
// webpack.config.js

var config = {
    host: "https://cdnjs.cloudflare.com/ajax/libs",
	cdn: {
		js: "https://cdnjs.cloudflare.com/ajax/libs",
		css: "https://cdnjs.cloudflare.com/ajax/libs"
	}
}
var webpackConfig = {
  entry: 'index.js',
  output: {
    path: 'dist',
    filename: 'index_bundle.js'
  },
  plugins: [
        new HtmlWebpackCdnPlugin(config),
        new HtmlWebpackPlugin()
  ]
};

```

``` javascript
// index.js
var $ = require("cdn?jQuery@3.1.0")
// Now you can use it
$('.app')
require("cdn?normalize@4.2.0&type=css")
// cdn-loader
// .......more code

```

Then 

``` html

<!DOCTYPE html>
<html>
    <head>
        <title>app</title>
        <link rel="stylesheet" href="http://cdn.bootcss.com/normalize/4.2.0/normalize.min.css">
    </head>
    <body>
        <div class="app"></div>
        <!-- more code -->
    </body>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
    <script src="index_bundle.js"></script>
</html>

```

---
_Source: https://npm.io/package/html-webpack-cdn-plugin · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._