npmpackage.info

Gathering detailed insights and metrics for html-webpack-replaceurl-plugin

Other packages similar to html-webpack-replaceurl-plugin

html-webpack-plugin-replaceurl

1.1.2

repalce static files' url in html

Gathering detailed insights and metrics for html-webpack-replaceurl-plugin

html-webpack-replaceurl-plugin - 1.0.0 | npmpackage.info

html-webpack-replaceurl-plugin

1.0.0

24.98 kB

6,413

Installations

npm install html-webpack-replaceurl-plugin

Developer Guide

BETA

Typescript

No

Module System

CommonJS

Node Version

5.10.1

NPM Version

3.8.3 Score

67.2

Supply Chain

91.6

Quality

75.5

Maintenance

100

Vulnerability

99.6

License

Releases

Unable to fetch releases

Download Statistics

Total Downloads

6,413

Last Day

Last Week

Last Month

Last Year

268

Bundle Size

71.36 kB

Minified

24.98 kB

Minified + Gzipped

Bundlephobia

Maintainers

Package Meta Information

Latest Version

1.0.0

Package Id

html-webpack-replaceurl-plugin@1.0.0

Size

2.31 kB

NPM Version

3.8.3

Node Version

5.10.1

Total Downloads

Cumulative downloads

Total Downloads

6,413

Last Day

900%

Compared to previous day

Last Week

180%

Compared to previous week

Last Month

Compared to previous month

Last Year

32.7%

268

Compared to previous year

Weekly Downloads

Monthly Downloads

Yearly Downloads

Dependencies

lodash

Html Webpack Replaceurl Plugin

此插件需配合html-webpack-plugin使用，作用是将html文档中对本地静态资源（js/style）的引用替换为经webpack编译后url。

安装

npm install html-webpack-replaceurl-plugin --save-dev

使用方法

配置webpack:

1let HtmlWebpackPlugin = require('html-webpack-plugin');
2let HtmlWebpackReplaceurlPlugin = require('html-webpack-replaceurl-plugin');
3let webpackConfig = {
4  entry: {
5      'main.a':'main.a.js',
6      'vendor': 'vue'
7  },
8  output: {
9    path: 'dist',
10    publicPath: '/',
11    filename: '[name].[hash].js'
12  },
13  plugins: [
14      new webpack.optimize.CommonsChunkPlugin({
15          name: 'vendor',
16          filename: 'vendor.js'
17      }),
18      new HtmlWebpackPlugin({
19          inject: false, //此项必须配置为false
20      }),
21      new HtmlWebpackReplaceurlPlugin({
22          mainFilePrefix: {
23              js: 'main',
24              css: 'main'
25          },
26          vendor: 'vendor.js'
27      })]
28};

上述配置项应用于index.html文件：

1<!DOCTYPE html>
2<html>
3  <head>
4    <meta charset="UTF-8">
5    <title>Webpack App</title>
6    <script src="vendor.js"></script>
7  </head>
8  <body>
9    <script src="main.a.js"></script>
10  </body>
11</html>

编译后的index.html内容为：

1<html>
2  <head>
3    <meta charset="UTF-8">
4    <title>Webpack App</title>
5    <script src="/dist/vendor.js"></script>
6  </head>
7  <body>
8    <script src="/dist/main.a.bc2e63dd.js"></script>
9  </body>
10</html>

详细配置

mainFilePrefix:js/style文件的命名前缀，以此前缀匹配html文档中的文件引用。默认都是main；
vendor:是否需要匹配vendor文件，如果为false，则不匹配html文档中的vendor文件。默认匹配vendor.js。

No vulnerabilities found.

No security vulnerabilities found.