npm

Bring the best of OSS JavaScript development to your projects with npm Orgs - private packages & team management tools.Learn more »

html-webpack-cdn-plugin

0.2.0 • Public • Published

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 and html-webpack-plugin

Support

css and js files https://cdnjs.com

Config

Example

// 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()
  ]
};
 
// 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

 
<!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>
 

install

npm i html-webpack-cdn-plugin

Downloadsweekly downloads

23

version

0.2.0

license

GPL

homepage

github.com

repository

Gitgithub

last publish

collaborators

  • avatar
Report a vulnerability