Skip to content

Commit b08ba9a

Browse files
committed
Updates the way to pack library for releases
1 parent 5237634 commit b08ba9a

File tree

16 files changed

+81
-26
lines changed

16 files changed

+81
-26
lines changed

CHANGELOG.md

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,28 @@
11
# Topcoder React Utils Changelog
22

3+
### v0.6.0
4+
A better way to build the library: both dev and prod builds are created; and
5+
the proper version is selected depending on `NODE_ENV` value at the buildtime
6+
(client-side) or runtime (server-side) of the host code.
7+
8+
**BREAKING CHANGE:** You should update the way you include style the global
9+
stylesheet into the host code, from:
10+
```jsx
11+
require('topcoder-react-utils/dist/style.css');
12+
```
13+
to
14+
```jsx
15+
/* eslint-disable global-require */
16+
if (process.env.NODE_ENV === 'production') {
17+
require('topcoder-react-utils/dist/prod/style.css');
18+
} else {
19+
require('topcoder-react-utils/dist/dev/style.css');
20+
}
21+
/* eslint-enable global-require */
22+
```
23+
This will include the proper version of compiled global styles into the host
24+
code.
25+
326
### v0.5.0
427
All dependencies are force-updated to their latest versions. It might introduce
528
breaking changes.

README.md

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -26,8 +26,14 @@ $ npm install --save topcoder-react-utils
2626
$ ./node_modules/.bin/topcoder-lib-setup
2727
```
2828
Then import the global stylesheet into the root ReactJS component of your app:
29-
```js
30-
import 'topcoder-react-utils/dist/style.css';
29+
```jsx
30+
/* eslint-disable global-require */
31+
if (process.env.NODE_ENV === 'production') {
32+
require('topcoder-react-utils/dist/prod/style.css');
33+
} else {
34+
require('topcoder-react-utils/dist/dev/style.css');
35+
}
36+
/* eslint-enable global-require */
3137
```
3238

3339
To upgrade this library to the latest version just execute again

__tests__/shared/utils/isomorphy.js

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ afterEach(() => {
99
delete window.TRU_BUILD_INFO;
1010
delete window.TRU_FRONT_END;
1111
delete process.env.BABEL_ENV;
12+
process.env.NODE_ENV = 'test';
1213
});
1314

1415
beforeEach(() => jest.resetModules());
@@ -25,27 +26,27 @@ test('Server-side detection', () => {
2526
});
2627

2728
test('Dev mode detection - client side', () => {
28-
window.TRU_BUILD_INFO = { mode: 'development' };
29+
process.env.NODE_ENV = 'development';
2930
window.TRU_FRONT_END = true;
3031
expect(m().isDevBuild()).toBe(true);
3132
expect(m().isProdBuild()).toBe(false);
3233
});
3334

3435
test('Dev mode detection - server side', () => {
35-
global.TRU_BUILD_INFO = { mode: 'development' };
36+
process.env.NODE_ENV = 'development';
3637
expect(m().isDevBuild()).toBe(true);
3738
expect(m().isProdBuild()).toBe(false);
3839
});
3940

4041
test('Prod mode - client side', () => {
41-
window.TRU_BUILD_INFO = { mode: 'production' };
42+
process.env.NODE_ENV = 'production';
4243
window.TRU_FRONT_END = true;
4344
expect(m().isDevBuild()).toBe(false);
4445
expect(m().isProdBuild()).toBe(true);
4546
});
4647

4748
test('Prod mode - server side', () => {
48-
global.TRU_BUILD_INFO = { mode: 'production' };
49+
process.env.NODE_ENV = 'production';
4950
expect(m().isDevBuild()).toBe(false);
5051
expect(m().isProdBuild()).toBe(true);
5152
});

config/webpack/app-base.js

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -67,9 +67,6 @@ module.exports = function configFactory(ops) {
6767
/* A random 32-bit key, that can be used for encryption. */
6868
key: forge.random.getBytesSync(32),
6969

70-
/* This will be equal to "development" or "production" */
71-
mode: ops.babelEnv,
72-
7370
/* Build timestamp. */
7471
timestamp: now.utc().toISOString(),
7572
};
@@ -83,10 +80,10 @@ module.exports = function configFactory(ops) {
8380
else if (!_.isArray(entry.polyfills)) {
8481
entry.polyfills = [entry.polyfills];
8582
}
83+
8684
entry.polyfills = _.union(entry.polyfills, [
8785
'babel-polyfill',
8886
'nodelist-foreach-polyfill',
89-
'topcoder-react-utils/dist/client/init',
9087
]);
9188

9289
return {

config/webpack/app-development.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -53,5 +53,6 @@ module.exports = function configFactory(ops) {
5353
'react-hot-loader/patch',
5454
'webpack-hot-middleware/client?reload=true',
5555
].concat(res.entry.main);
56+
res.entry.polyfills.push('topcoder-react-utils/dist/dev/client/init');
5657
return res;
5758
};

config/webpack/app-production.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ const webpackMerge = require('webpack-merge');
2828
* @param {String} ops.publicPath Base URL for the output of the build assets.
2929
*/
3030
module.exports = function configFactory(ops) {
31-
return webpackMerge.smart(baseFactory({
31+
const res = webpackMerge.smart(baseFactory({
3232
...ops,
3333
babelEnv: 'production',
3434
mode: 'production',
@@ -52,4 +52,6 @@ module.exports = function configFactory(ops) {
5252
}),
5353
],
5454
});
55+
res.entry.polyfills.push('topcoder-react-utils/dist/prod/client/init');
56+
return res;
5557
};

config/webpack/lib-base.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,8 @@ const webpack = require('webpack');
2828
*
2929
* @param {String} ops.library Name of the library.
3030
*
31+
* @param {String} ops.outputPath Output path.
32+
*
3133
* @return {Object} Webpack config.
3234
*/
3335
module.exports = function configFactory(ops) {
@@ -65,7 +67,7 @@ module.exports = function configFactory(ops) {
6567
globalObject: "typeof self !== 'undefined' ? self : this",
6668

6769
library: ops.library,
68-
path: path.resolve(__dirname, ops.context, 'dist'),
70+
path: ops.outputPath,
6971
libraryTarget: 'umd',
7072
},
7173
plugins: [

config/webpack/lib-development.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33
*/
44

55
const baseFactory = require('./lib-base');
6+
const path = require('path');
67

78
/**
89
* Creates a new Webpack config.
@@ -25,5 +26,6 @@ module.exports = function configFactory(ops) {
2526
babelEnv: 'development',
2627
cssLocalIdent: '[path][name]___[local]___[hash:base64:6]',
2728
mode: 'development',
29+
outputPath: path.resolve(__dirname, ops.context, 'dist/dev'),
2830
});
2931
};

config/webpack/lib-production.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33
*/
44

55
const baseFactory = require('./lib-base');
6+
const path = require('path');
67

78
/**
89
* Creates a new Webpack config.
@@ -25,5 +26,6 @@ module.exports = function configFactory(ops) {
2526
babelEnv: 'production',
2627
cssLocalIdent: '[hash:base64:6]',
2728
mode: 'production',
29+
outputPath: path.resolve(__dirname, ops.context, 'dist/prod'),
2830
});
2931
};

index.js

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
/**
2+
* Entry point of the library.
3+
*
4+
* Depending on NODE_ENV variable, it proxies production or development build of
5+
* the library.
6+
*/
7+
/* eslint-disable global-require, import/no-unresolved */
8+
9+
if (process.env.NODE_ENV === 'production') {
10+
module.exports = require('./dist/prod');
11+
} else {
12+
module.exports = require('./dist/dev');
13+
}

0 commit comments

Comments
 (0)