Add InjectAsComment tag option
This commit is contained in:
radswiat
parent
0c334edfd8
commit
359037d7a1
12 changed files with 1069 additions and 710 deletions
34
README.md
34
README.md
|
|
@ -12,7 +12,7 @@ $ npm install webpack-auto-inject-version --save-dev
|
|||
[How to use](#user-content-how-to-use) <br>
|
||||
[Available options](#user-content-available-options) <br>
|
||||
[Output examples](#user-content-output-examples)
|
||||
|
||||
[Change log](#user-content-change-log)
|
||||
|
||||
|
||||
|
||||
|
|
@ -81,11 +81,33 @@ Default: true
|
|||
|
||||
### components.InjectAsComment
|
||||
This will inject your version as a comment into any css,js,html file.<br>
|
||||
You can change what is injected into the file by changing componentsOptions.InjectAsComment.tag.
|
||||
Currently only 2 tags are supported:
|
||||
* {version}
|
||||
* {date} ( current date )
|
||||
Example:
|
||||
``` javascript
|
||||
...
|
||||
plugins: [
|
||||
...
|
||||
new WebpackAutoInject({
|
||||
PACKAGE_JSON_PATH: './package.json',
|
||||
components: {
|
||||
...
|
||||
InjectAsComment: true
|
||||
},
|
||||
componentsOptions: {
|
||||
...
|
||||
InjectAsComment: {
|
||||
tag: 'Build version: {version} - {date}' // default
|
||||
}
|
||||
})
|
||||
]
|
||||
```
|
||||
Default: true
|
||||
|
||||
|
||||
|
||||
|
||||
# Output-examples
|
||||
AIV can inject version number for all your bundle files (css,js,html).<br><br>
|
||||
```js
|
||||
|
|
@ -103,3 +125,11 @@ Example html:
|
|||
```
|
||||
|
||||
|
||||
|
||||
# Change log
|
||||
## [0.5.13] - 12/04/2017
|
||||
- Tag from InjectAsComment can now be configured by options ( componentsOptions.InjectAsComment.tag )
|
||||
- Default tag template for InjectAsComment has change
|
||||
## [0.5.12] - 12/04/2017
|
||||
- Fix dependency missing issue
|
||||
- Remove export as object with .default as a class
|
||||
|
|
|
|||
25
demo/dist/index-bundle.js
vendored
25
demo/dist/index-bundle.js
vendored
|
|
@ -1,4 +1,4 @@
|
|||
// [AIV] Build version: 0.13.4
|
||||
// [AIV] Build version: 0.13.4 - Wednesday, April 12th, 2017, 11:34:31 PM
|
||||
/******/ (function(modules) { // webpackBootstrap
|
||||
/******/ // The module cache
|
||||
/******/ var installedModules = {};
|
||||
|
|
@ -64,20 +64,14 @@
|
|||
/******/ __webpack_require__.p = "";
|
||||
/******/
|
||||
/******/ // Load entry module and return exports
|
||||
/******/ return __webpack_require__(__webpack_require__.s = 1);
|
||||
/******/ return __webpack_require__(__webpack_require__.s = 2);
|
||||
/******/ })
|
||||
/************************************************************************/
|
||||
/******/ ([
|
||||
/* 0 */
|
||||
/***/ (function(module, exports) {
|
||||
|
||||
module.exports = "<!DOCTYPE html><html lang=en><head><meta charset=UTF-8><title>Title</title></head><body><span>My awesome project | 0.13.4></span></body></html>"
|
||||
|
||||
/***/ }),
|
||||
/* 1 */
|
||||
/***/ (function(module, exports, __webpack_require__) {
|
||||
|
||||
var html = __webpack_require__(0);
|
||||
var html = __webpack_require__(1);
|
||||
|
||||
/**
|
||||
* Sample code
|
||||
|
|
@ -90,5 +84,18 @@ var test = function(val) {
|
|||
test(myVariable);
|
||||
|
||||
|
||||
/***/ }),
|
||||
/* 1 */
|
||||
/***/ (function(module, exports) {
|
||||
|
||||
module.exports = "<!DOCTYPE html><html lang=en><head><meta charset=UTF-8><title>Title</title></head><body><span>My awesome project | 0.13.4></span></body></html>"
|
||||
|
||||
/***/ }),
|
||||
/* 2 */
|
||||
/***/ (function(module, exports, __webpack_require__) {
|
||||
|
||||
module.exports = __webpack_require__(0);
|
||||
|
||||
|
||||
/***/ })
|
||||
/******/ ]);
|
||||
|
|
@ -11,6 +11,7 @@
|
|||
"author": "Radoslaw Swiat",
|
||||
"license": "ISC",
|
||||
"devDependencies": {
|
||||
"html-loader": "^0.4.5",
|
||||
"html-minify-loader": "^1.1.0",
|
||||
"raw-loader": "^0.5.1",
|
||||
"webpack": "^2.3.3",
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
var path = require('path');
|
||||
// Require WebpackAutoInject from npm installed modules ( preferred )
|
||||
var WebpackAutoInject = require('webpack-auto-inject-version');
|
||||
// var WebpackAutoInject = require('webpack-auto-inject-version');
|
||||
// Require WebpackAutoInject from dist - dev purpose only ( do not use the below line )
|
||||
// var WebpackAutoInject = require('../dist/WebpackAutoInjectVersion');
|
||||
var WebpackAutoInject = require('../dist/WebpackAutoInjectVersion');
|
||||
|
||||
module.exports = {
|
||||
entry: {
|
||||
index: './src/main.js'
|
||||
index: ['./src/main.js']
|
||||
},
|
||||
resolve: {
|
||||
extensions: ['.js', '.html']
|
||||
|
|
|
|||
1597
dist/WebpackAutoInjectVersion.js
vendored
1597
dist/WebpackAutoInjectVersion.js
vendored
File diff suppressed because it is too large
Load diff
71
package.json
71
package.json
|
|
@ -1,37 +1,38 @@
|
|||
{
|
||||
"name": "webpack-auto-inject-version",
|
||||
"version": "0.5.12",
|
||||
"repository": "radswiat/webpack-auto-inject-version",
|
||||
"description": "Webpack plugin for auto inject version from package.json",
|
||||
"main": "dist/WebpackAutoInjectVersion.js",
|
||||
"scripts": {
|
||||
"start": "babel-node tools/compile.js"
|
||||
},
|
||||
"author": "Radoslaw Swiat",
|
||||
"license": "ISC",
|
||||
"devDependencies": {
|
||||
"chalk": "^1.1.3",
|
||||
"lodash": "^4.17.4",
|
||||
"optimist": "^0.6.1",
|
||||
"semver": "^5.3.0",
|
||||
"babel-cli": "^6.10.1",
|
||||
"babel-core": "^6.24.1",
|
||||
"babel-eslint": "^6.0.0",
|
||||
"babel-loader": "^6.2.4",
|
||||
"babel-plugin-module-resolver": "^2.4.0",
|
||||
"babel-plugin-transform-runtime": "^6.12.0",
|
||||
"babel-preset-es2015": "^6.6.0",
|
||||
"babel-preset-node5": "^11.0.1",
|
||||
"babel-preset-react": "^6.5.0",
|
||||
"babel-preset-stage-2": "^6.22.0",
|
||||
"gutil": "^1.6.4",
|
||||
"webpack": "^2.3.3",
|
||||
"webpack-node-externals": "^1.5.4",
|
||||
"eslint": "^2.7.0",
|
||||
"eslint-config-airbnb": "^6.2.0",
|
||||
"eslint-loader": "^1.5.0",
|
||||
"eslint-plugin-babel": "^3.2.0",
|
||||
"eslint-plugin-jsx-control-statements": "^2.1.1",
|
||||
"eslint-plugin-react": "^4.2.3"
|
||||
}
|
||||
"name": "webpack-auto-inject-version",
|
||||
"version": "0.5.12",
|
||||
"repository": "radswiat/webpack-auto-inject-version",
|
||||
"description": "Webpack plugin for auto inject version from package.json",
|
||||
"main": "dist/WebpackAutoInjectVersion.js",
|
||||
"scripts": {
|
||||
"start": "babel-node tools/compile.js"
|
||||
},
|
||||
"author": "Radoslaw Swiat",
|
||||
"license": "ISC",
|
||||
"devDependencies": {
|
||||
"babel-cli": "^6.10.1",
|
||||
"babel-core": "^6.24.1",
|
||||
"babel-eslint": "^6.0.0",
|
||||
"babel-loader": "^6.2.4",
|
||||
"babel-plugin-module-resolver": "^2.4.0",
|
||||
"babel-plugin-transform-runtime": "^6.12.0",
|
||||
"babel-preset-es2015": "^6.6.0",
|
||||
"babel-preset-node5": "^11.0.1",
|
||||
"babel-preset-react": "^6.5.0",
|
||||
"babel-preset-stage-2": "^6.22.0",
|
||||
"chalk": "^1.1.3",
|
||||
"dateformat": "^2.0.0",
|
||||
"eslint": "^2.7.0",
|
||||
"eslint-config-airbnb": "^6.2.0",
|
||||
"eslint-loader": "^1.5.0",
|
||||
"eslint-plugin-babel": "^3.2.0",
|
||||
"eslint-plugin-jsx-control-statements": "^2.1.1",
|
||||
"eslint-plugin-react": "^4.2.3",
|
||||
"gutil": "^1.6.4",
|
||||
"lodash": "^4.17.4",
|
||||
"optimist": "^0.6.1",
|
||||
"semver": "^5.3.0",
|
||||
"webpack": "^2.3.3",
|
||||
"webpack-node-externals": "^1.5.4"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,8 @@
|
|||
import path from 'path';
|
||||
import config from 'config';
|
||||
import log from 'core/log';
|
||||
import tags from './tags';
|
||||
import chalk from 'chalk';
|
||||
|
||||
const endOfLine = require('os').EOL;
|
||||
|
||||
|
|
@ -29,12 +31,15 @@ export default class InjectAsComment {
|
|||
let asset = compilation.assets[basename];
|
||||
switch (ext) {
|
||||
case '.js' :
|
||||
console.log(chalk.blue.bold('js'));
|
||||
this.injectIntoJs(asset);
|
||||
break;
|
||||
case '.html' :
|
||||
console.log(chalk.blue.bold('html'));
|
||||
this.injectIntoHtml(asset);
|
||||
break;
|
||||
case '.css' :
|
||||
console.log(chalk.blue.bold('css'));
|
||||
this.injectIntoCss(asset);
|
||||
break;
|
||||
default:
|
||||
|
|
@ -47,21 +52,34 @@ export default class InjectAsComment {
|
|||
return new Promise((resolve) => { resolve(); });
|
||||
}
|
||||
|
||||
parseTags(baseOpen, baseClose) {
|
||||
let tagPattern = this.context.config.componentsOptions.InjectAsComment.tag;
|
||||
tagPattern = tagPattern.replace(/(\{([a-zA-Z]+)\})/g, (tag) => {
|
||||
let tagName = tag.replace(/(\{|\})/g, '');
|
||||
if (typeof tags[tagName] === 'function') {
|
||||
return tags[tagName](this.context);
|
||||
}
|
||||
log.error(`unsupported tag in componentsOptions.InjectAsComment.tag [${tagName}]`);
|
||||
return tag;
|
||||
});
|
||||
return `${baseOpen} ${tagPattern} ${baseClose}`;
|
||||
}
|
||||
|
||||
injectIntoCss(asset) {
|
||||
let modAsset = `/** [${config.SHORT}] Build version: ${this.context.version} **/ `;
|
||||
let modAsset = this.parseTags(`/** [${config.SHORT}] `, ' **/ ');
|
||||
modAsset += `${endOfLine} ${asset.source()} `;
|
||||
asset.source = () => modAsset;
|
||||
}
|
||||
|
||||
injectIntoHtml(asset) {
|
||||
let modAsset = `<!-- [${config.SHORT}] Build version: ${this.context.version} --> `;
|
||||
let modAsset = this.parseTags(`<!-- [${config.SHORT}] `, ' --> ');
|
||||
modAsset += `${endOfLine} ${asset.source()} `;
|
||||
asset.source = () => modAsset;
|
||||
}
|
||||
|
||||
injectIntoJs(asset) {
|
||||
let modAsset = `// [${config.SHORT}] Build version: ${this.context.version} `;
|
||||
modAsset = `${endOfLine} ${asset.source()} `;
|
||||
let modAsset = this.parseTags(`// [${config.SHORT}] `, ' ');
|
||||
modAsset += `${endOfLine} ${asset.source()} `;
|
||||
asset.source = () => modAsset;
|
||||
}
|
||||
}
|
||||
10
src/components/inject-as-comment/tags.js
Normal file
10
src/components/inject-as-comment/tags.js
Normal file
|
|
@ -0,0 +1,10 @@
|
|||
import dateFormat from 'dateformat';
|
||||
|
||||
export default {
|
||||
version: (context) => {
|
||||
return context.version;
|
||||
},
|
||||
date: () => {
|
||||
return dateFormat(new Date(), 'dddd, mmmm dS, yyyy, h:MM:ss TT');
|
||||
}
|
||||
};
|
||||
|
|
@ -6,6 +6,9 @@ export default {
|
|||
InjectByTag: true
|
||||
},
|
||||
componentsOptions: {
|
||||
InjectAsComment: {
|
||||
tag: 'Build version: {version} - {date}'
|
||||
},
|
||||
InjectByTag: {
|
||||
fileRegex: /\.+/
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,9 +6,9 @@ import log from 'core/log';
|
|||
import { merge, transform } from 'lodash';
|
||||
|
||||
// import sub components
|
||||
import AutoIncreaseVersion from 'components/auto-increase-version';
|
||||
import InjectAsComment from 'components/inject-as-comment';
|
||||
import InjectByTag from 'components/inject-by-tag';
|
||||
import AutoIncreaseVersion from 'components/auto-increase-version/auto-increase-version';
|
||||
import InjectAsComment from 'components/inject-as-comment/inject-as-comment';
|
||||
import InjectByTag from 'components/inject-by-tag/inject-by-tag';
|
||||
|
||||
export default class WebpackAutoInject {
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue