Skip to content

Commit b205a08

Browse files
KyLeoHCKyLeoHC
authored
Merge pull request #2 from KyLeoHC/feature/supportRegxMatch
Feature/support regx match
2 parents 132313e + 36b795d commit b205a08

16 files changed

Lines changed: 1324 additions & 4630 deletions

‎.editorconfig‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
root = true
2+
3+
[*]
4+
charset = utf-8
5+
end_of_line = lf
6+
trim_trailing_whitespace = true
7+
insert_final_newline = true
8+
indent_style = space
9+
indent_size = 2

‎.gitignore‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
11
.idea
22
node_modules
3-
demo/node_modules
3+
demo/node_modules
4+
demo/dist

‎README.md‎

Lines changed: 46 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,78 +1,82 @@
11
<a href="https://www.npmjs.com/package/inline-source-webpack-plugin"><img src="https://img.shields.io/npm/v/inline-source-webpack-plugin.svg" alt="npm Version"></a>
22

33
# inline-source-webpack-plugin
4+
45
A webpack plugin to embed css/js resource in the html with inline-source module([html-webpack-plugin](https://github.com/jantimon/html-webpack-plugin) is needed).
56

67
## Install
8+
79
```bash
8-
$ npm install -S inline-source-webpack-plugin
10+
$ npm i inline-source-webpack-plugin -D
911
```
1012

1113
## example
14+
1215
```html
13-
<!-- ./build/index.html -->
16+
<!-- ./demo/src/index.html -->
1417
<!DOCTYPE html>
1518
<html lang="en">
16-
<head>
19+
<head>
1720
<meta charset="UTF-8">
1821
<title>test</title>
1922
<link href="inline.css" inline>
2023
<script src="inline.js" inline></script>
21-
</head>
22-
<body>
23-
<div class="container">
24-
<h1>hello world!</h1>
25-
</div>
26-
<!-- 'inline-bundle' attribute tell us to embed file that generated by webpack -->
27-
<script inline inline-bundle="bundle.js"></script>
28-
</body>
24+
</head>
25+
<body>
26+
<div class="container">
27+
<h1>hello world!</h1>
28+
</div>
29+
<!-- 'inline-bundle' attribute tell us to embed file that generated by webpack -->
30+
<script inline inline-bundle="bundle\.\w+\.js$" inline-bundle-delete></script>
31+
</body>
2932
</html>
3033
```
3134

3235
```js
33-
/* ./src/inline.js */
36+
/* ./demo/src/inline.js */
3437
function Person() {
3538
}
3639

3740
Person.prototype.sayHello = function () {
38-
var word = 'hello';
39-
console.log(word);
41+
var word = 'hello';
42+
console.log(word);
4043
};
4144
```
4245

4346
```js
44-
/* ./src/bundle.js */
47+
/* ./demo/src/bundle.js */
4548
console.log('This file is build by webpack.But InlineSourceWebpackPlugin will embed it into html file.');
4649
```
4750

4851
```css
49-
/* ./src/inline.css */
52+
/* ./demo/src/inline.css */
5053
.container {
51-
border: 1px solid #000;
54+
border: 1px solid #000;
5255
}
5356
```
5457

5558
Output:
59+
5660
```html
57-
<!-- ./build/index.html -->
61+
<!-- ./demo/dist/index.html -->
5862
<!DOCTYPE html>
5963
<html lang="en">
60-
<head>
64+
<head>
6165
<meta charset="UTF-8">
6266
<title>test</title>
6367
<style>.container{border:1px solid #ff2c58}</style>
6468
<script>function Person(){}Person.prototype.sayHello=function(){console.log("[inline]:","hello world!")},(new Person).sayHello();</script>
65-
</head>
66-
<body>
67-
<div class="container">
68-
<h1>hello world!</h1>
69-
</div>
70-
<script>(window.webpackJsonp=window.webpackJsonp||[]).push([["bundle"],[,function(i,e){console.log("This file is build by webpack.But InlineSourceWebpackPlugin will embed it into html file.")}],[[1,"runtime"]]]);</script>
71-
<script type="text/javascript" src="/inline-source-webpack-plugin/demo/dist/runtime.js"></script>
72-
<script type="text/javascript" src="/inline-source-webpack-plugin/demo/dist/index.js"></script>
73-
</body>
69+
</head>
70+
<body>
71+
<div class="container">
72+
<h1>hello world!</h1>
73+
</div>
74+
<!-- 'inline-bundle' attribute tell us to embed file that generated by webpack -->
75+
<script>(window.webpackJsonp=window.webpackJsonp||[]).push([["bundle"],[,function(i,e){console.log("This file is build by webpack.But InlineSourceWebpackPlugin will embed it into html file.")}],[[1,"runtime"]]]);</script>
76+
<script type="text/javascript" src="/inline-source-webpack-plugin/demo/dist/runtime.ee77f51ffadaa60b61bb.js"></script><script type="text/javascript" src="/inline-source-webpack-plugin/demo/dist/index.52decaca808fa7663ddf.js"></script></body>
7477
</html>
7578
```
79+
7680
note: You can find this demo in the demo directory.
7781

7882
## Usage
@@ -86,25 +90,28 @@ const HtmlWebpackPlugin = require('html-webpack-plugin');
8690
const InlineSourceWebpackPlugin = require('inline-source-webpack-plugin');
8791

8892
module.exports = {
89-
...
90-
plugins: [
91-
new HtmlWebpackPlugin({
92-
...
93-
}),
94-
new InlineSourceWebpackPlugin({
95-
compress: true,
96-
rootpath: './src'
97-
})
98-
]
93+
...,
94+
plugins: [
95+
new HtmlWebpackPlugin({
96+
...
97+
}),
98+
new InlineSourceWebpackPlugin({
99+
compress: true,
100+
rootpath: './src'
101+
})
102+
]
99103
};
100104
```
101105

102106
If you want to embed the files that generated by webpack or other plugin, you can use `inline-bundle` attribute to filter the files(Please don't try to use `src` or `href`).
103107
Add `inline-bundle-delete` attribute for deleting the bundle after inline task.
108+
104109
```html
105110
<script inline inline-bundle-delete inline-bundle="Your bundle path/Your bundle name"></script>
106111
```
107112

113+
The value of `inline-bundle` attribute is a *regular expression*.
114+
108115
## License
109116

110-
[MIT License](https://github.com/KyLeoHC/inline-source-webpack-plugin/blob/master/LICENSE)
117+
[MIT License](https://github.com/KyLeoHC/inline-source-webpack-plugin/blob/master/LICENSE)

‎demo/dist/bundle.js‎

Lines changed: 0 additions & 1 deletion
This file was deleted.

‎demo/dist/index.html‎

Lines changed: 0 additions & 16 deletions
This file was deleted.

‎demo/dist/index.js‎

Lines changed: 0 additions & 1 deletion
This file was deleted.

‎demo/dist/runtime.js‎

Lines changed: 0 additions & 1 deletion
This file was deleted.

0 commit comments

Comments
 (0)