Add InjectAsComment tag option

This commit is contained in:
radswiat 2017-04-12 23:40:22 +01:00
parent 0c334edfd8
commit 359037d7a1
12 changed files with 1069 additions and 710 deletions

View file

@ -12,7 +12,7 @@ $ npm install webpack-auto-inject-version --save-dev
[How to use](#user-content-how-to-use) <br> [How to use](#user-content-how-to-use) <br>
[Available options](#user-content-available-options) <br> [Available options](#user-content-available-options) <br>
[Output examples](#user-content-output-examples) [Output examples](#user-content-output-examples)
[Change log](#user-content-change-log)
@ -81,11 +81,33 @@ Default: true
### components.InjectAsComment ### components.InjectAsComment
This will inject your version as a comment into any css,js,html file.<br> 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 Default: true
# Output-examples # Output-examples
AIV can inject version number for all your bundle files (css,js,html).<br><br> AIV can inject version number for all your bundle files (css,js,html).<br><br>
```js ```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

View file

@ -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 /******/ (function(modules) { // webpackBootstrap
/******/ // The module cache /******/ // The module cache
/******/ var installedModules = {}; /******/ var installedModules = {};
@ -64,20 +64,14 @@
/******/ __webpack_require__.p = ""; /******/ __webpack_require__.p = "";
/******/ /******/
/******/ // Load entry module and return exports /******/ // Load entry module and return exports
/******/ return __webpack_require__(__webpack_require__.s = 1); /******/ return __webpack_require__(__webpack_require__.s = 2);
/******/ }) /******/ })
/************************************************************************/ /************************************************************************/
/******/ ([ /******/ ([
/* 0 */ /* 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__) { /***/ (function(module, exports, __webpack_require__) {
var html = __webpack_require__(0); var html = __webpack_require__(1);
/** /**
* Sample code * Sample code
@ -90,5 +84,18 @@ var test = function(val) {
test(myVariable); 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);
/***/ }) /***/ })
/******/ ]); /******/ ]);

View file

@ -11,6 +11,7 @@
"author": "Radoslaw Swiat", "author": "Radoslaw Swiat",
"license": "ISC", "license": "ISC",
"devDependencies": { "devDependencies": {
"html-loader": "^0.4.5",
"html-minify-loader": "^1.1.0", "html-minify-loader": "^1.1.0",
"raw-loader": "^0.5.1", "raw-loader": "^0.5.1",
"webpack": "^2.3.3", "webpack": "^2.3.3",

View file

@ -1,12 +1,12 @@
var path = require('path'); var path = require('path');
// Require WebpackAutoInject from npm installed modules ( preferred ) // 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 ) // 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 = { module.exports = {
entry: { entry: {
index: './src/main.js' index: ['./src/main.js']
}, },
resolve: { resolve: {
extensions: ['.js', '.html'] extensions: ['.js', '.html']

File diff suppressed because it is too large Load diff

View file

@ -1,37 +1,38 @@
{ {
"name": "webpack-auto-inject-version", "name": "webpack-auto-inject-version",
"version": "0.5.12", "version": "0.5.12",
"repository": "radswiat/webpack-auto-inject-version", "repository": "radswiat/webpack-auto-inject-version",
"description": "Webpack plugin for auto inject version from package.json", "description": "Webpack plugin for auto inject version from package.json",
"main": "dist/WebpackAutoInjectVersion.js", "main": "dist/WebpackAutoInjectVersion.js",
"scripts": { "scripts": {
"start": "babel-node tools/compile.js" "start": "babel-node tools/compile.js"
}, },
"author": "Radoslaw Swiat", "author": "Radoslaw Swiat",
"license": "ISC", "license": "ISC",
"devDependencies": { "devDependencies": {
"chalk": "^1.1.3", "babel-cli": "^6.10.1",
"lodash": "^4.17.4", "babel-core": "^6.24.1",
"optimist": "^0.6.1", "babel-eslint": "^6.0.0",
"semver": "^5.3.0", "babel-loader": "^6.2.4",
"babel-cli": "^6.10.1", "babel-plugin-module-resolver": "^2.4.0",
"babel-core": "^6.24.1", "babel-plugin-transform-runtime": "^6.12.0",
"babel-eslint": "^6.0.0", "babel-preset-es2015": "^6.6.0",
"babel-loader": "^6.2.4", "babel-preset-node5": "^11.0.1",
"babel-plugin-module-resolver": "^2.4.0", "babel-preset-react": "^6.5.0",
"babel-plugin-transform-runtime": "^6.12.0", "babel-preset-stage-2": "^6.22.0",
"babel-preset-es2015": "^6.6.0", "chalk": "^1.1.3",
"babel-preset-node5": "^11.0.1", "dateformat": "^2.0.0",
"babel-preset-react": "^6.5.0", "eslint": "^2.7.0",
"babel-preset-stage-2": "^6.22.0", "eslint-config-airbnb": "^6.2.0",
"gutil": "^1.6.4", "eslint-loader": "^1.5.0",
"webpack": "^2.3.3", "eslint-plugin-babel": "^3.2.0",
"webpack-node-externals": "^1.5.4", "eslint-plugin-jsx-control-statements": "^2.1.1",
"eslint": "^2.7.0", "eslint-plugin-react": "^4.2.3",
"eslint-config-airbnb": "^6.2.0", "gutil": "^1.6.4",
"eslint-loader": "^1.5.0", "lodash": "^4.17.4",
"eslint-plugin-babel": "^3.2.0", "optimist": "^0.6.1",
"eslint-plugin-jsx-control-statements": "^2.1.1", "semver": "^5.3.0",
"eslint-plugin-react": "^4.2.3" "webpack": "^2.3.3",
} "webpack-node-externals": "^1.5.4"
}
} }

View file

@ -1,6 +1,8 @@
import path from 'path'; import path from 'path';
import config from 'config'; import config from 'config';
import log from 'core/log'; import log from 'core/log';
import tags from './tags';
import chalk from 'chalk';
const endOfLine = require('os').EOL; const endOfLine = require('os').EOL;
@ -29,12 +31,15 @@ export default class InjectAsComment {
let asset = compilation.assets[basename]; let asset = compilation.assets[basename];
switch (ext) { switch (ext) {
case '.js' : case '.js' :
console.log(chalk.blue.bold('js'));
this.injectIntoJs(asset); this.injectIntoJs(asset);
break; break;
case '.html' : case '.html' :
console.log(chalk.blue.bold('html'));
this.injectIntoHtml(asset); this.injectIntoHtml(asset);
break; break;
case '.css' : case '.css' :
console.log(chalk.blue.bold('css'));
this.injectIntoCss(asset); this.injectIntoCss(asset);
break; break;
default: default:
@ -47,21 +52,34 @@ export default class InjectAsComment {
return new Promise((resolve) => { resolve(); }); 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) { injectIntoCss(asset) {
let modAsset = `/** [${config.SHORT}] Build version: ${this.context.version} **/ `; let modAsset = this.parseTags(`/** [${config.SHORT}] `, ' **/ ');
modAsset += `${endOfLine} ${asset.source()} `; modAsset += `${endOfLine} ${asset.source()} `;
asset.source = () => modAsset; asset.source = () => modAsset;
} }
injectIntoHtml(asset) { injectIntoHtml(asset) {
let modAsset = `<!-- [${config.SHORT}] Build version: ${this.context.version} --> `; let modAsset = this.parseTags(`<!-- [${config.SHORT}] `, ' --> ');
modAsset += `${endOfLine} ${asset.source()} `; modAsset += `${endOfLine} ${asset.source()} `;
asset.source = () => modAsset; asset.source = () => modAsset;
} }
injectIntoJs(asset) { injectIntoJs(asset) {
let modAsset = `// [${config.SHORT}] Build version: ${this.context.version} `; let modAsset = this.parseTags(`// [${config.SHORT}] `, ' ');
modAsset = `${endOfLine} ${asset.source()} `; modAsset += `${endOfLine} ${asset.source()} `;
asset.source = () => modAsset; asset.source = () => modAsset;
} }
} }

View 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');
}
};

View file

@ -6,6 +6,9 @@ export default {
InjectByTag: true InjectByTag: true
}, },
componentsOptions: { componentsOptions: {
InjectAsComment: {
tag: 'Build version: {version} - {date}'
},
InjectByTag: { InjectByTag: {
fileRegex: /\.+/ fileRegex: /\.+/
} }

View file

@ -6,9 +6,9 @@ import log from 'core/log';
import { merge, transform } from 'lodash'; import { merge, transform } from 'lodash';
// import sub components // import sub components
import AutoIncreaseVersion from 'components/auto-increase-version'; import AutoIncreaseVersion from 'components/auto-increase-version/auto-increase-version';
import InjectAsComment from 'components/inject-as-comment'; import InjectAsComment from 'components/inject-as-comment/inject-as-comment';
import InjectByTag from 'components/inject-by-tag'; import InjectByTag from 'components/inject-by-tag/inject-by-tag';
export default class WebpackAutoInject { export default class WebpackAutoInject {