Webpack Javascript Lib Building for easywebpack
npm install @easy-team/easywebpack-js
[![NPM version][npm-image]][npm-url]
[![build status][travis-image]][travis-url]
[![Test coverage][codecov-image]][codecov-url]
[![David deps][david-image]][david-url]
[![npm download][download-image]][download-url]
[npm-image]: https://img.shields.io/npm/v/easywebpack-js.svg?style=flat-square
[npm-url]: https://npmjs.org/package/easywebpack-js
[travis-image]: https://img.shields.io/travis/hubcarl/easywebpack-js.svg?style=flat-square
[travis-url]: https://travis-ci.org/hubcarl/easywebpack-js
[codecov-image]: https://codecov.io/gh/hubcarl/easywebpack-js/branch/master/graph/badge.svg
[codecov-url]: https://codecov.io/gh/hubcarl/easywebpack-js
[david-image]: https://img.shields.io/david/hubcarl/easywebpack-js-js.svg?style=flat-square
[david-url]: https://david-dm.org/hubcarl/easywebpack-js
[snyk-image]: https://snyk.io/test/npm/easywebpack-js/badge.svg?style=flat-square
[snyk-url]: https://snyk.io/test/npm/easywebpack-js
[download-image]: https://img.shields.io/npm/dm/easywebpack-js.svg?style=flat-square
[download-url]: https://npmjs.org/package/easywebpack-js
Buiding JavaScript Lib for Webpack
- Webpack 4
``bash
// babel 6
$ npm i easywebpack-js --save-dev
or
// babel 7
$ npm i @easy-team/easywebpack-js --save-dev
`
- Webpack 3
`bash`
$ npm i easywebpack-js@3 --save-dev
- write webpack build config for easywebpack-js
`js`
// build/index.js
const easywebpack = require('easywebpack-js');
const config = {
env: process.env.BUILD_ENV,
entry: {
'index': 'lib/index.js'
}
};
easywebpack.build(config);
- node build mode
`js`
{
"scripts": {
"build:test": "cross-env BUILD_ENV=test NODE_ENV=development node build/index.js",
"build:prod": "cross-env BUILD_ENV=prod NODE_ENV=production node build/index.js",
}
}
- write easywebpack-cli for easywebpack-js solution
`js`
// ${app_root}/webpack.config.js
const easywebpack = require('@easy-team/easywebpack-js');
module.exports = {
framework: 'js',
entry: {
'index': 'lib/index.js'
}
};
- easywebpack-cli command build
`js`
{
"scripts": {
"build:test": "easy build test",
"build:prod": "easy build prod",
}
}
> ${root}/src/react-lib.js
`js
import React from 'react';
import ReactDOM from 'react-dom';
// window.React = React;
// window.ReactDOM = ReactDOM;
export default {
React,
ReactDOM
}
`
> ${root}/webpack.config.js
`javascript`
module.exports = {
framework: 'js',
entry: {
'react-lib': 'scr/react-lib.js'
},
output: {
library: "ReactLib"
}
}
> ${root}/webpack.config.js
`js`
module.exports = {
....
externals: {
'react': 'ReactLib.default.React',
'react-dom': 'ReactLib.default.ReactDOM'
},
}
`html``