Skip to content

Commit c09cf9d

Browse files
RomanHotsiyRomanHotsiy
authored
chore: modernize build pipeline (#1635)
1 parent 92387bc commit c09cf9d

21 files changed

+9232
-14357
lines changed

‎README.md

+2-1
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,7 @@
2626
- The widest OpenAPI v2.0 features support (yes, it supports even `discriminator`) <br>
2727
![](docs/images/discriminator-demo.gif)
2828
- OpenAPI 3.0 support
29+
- Basic OpenAPI 3.1 support
2930
- Neat **interactive** documentation for nested objects <br>
3031
![](docs/images/nested-demo.gif)
3132
- Code samples support (via vendor extension) <br>
@@ -43,7 +44,6 @@
4344
- [x] ~~React rewrite~~
4445
- [x] ~~docs pre-rendering (performance and SEO)~~
4546
- [ ] ability to simple branding/styling
46-
- [ ] built-in API Console
4747

4848
## Releases
4949
**Important:** all the 2.x releases are deployed to npm and can be used via jsdeliver:
@@ -58,6 +58,7 @@ Additionally, all the 1.x releases are hosted on our GitHub Pages-based CDN **(d
5858
## Version Guidance
5959
| ReDoc Release | OpenAPI Specification |
6060
|:--------------|:----------------------|
61+
| 2.0.0-alpha.54| 3.1, 3.0.x, 2.0 |
6162
| 2.0.0-alpha.x | 3.0, 2.0 |
6263
| 1.19.x | 2.0 |
6364
| 1.18.x | 2.0 |

‎cli/npm-shrinkwrap.json

+313-367
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎cli/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -17,8 +17,8 @@
1717
"mkdirp": "^1.0.4",
1818
"mobx": "^6.3.2",
1919
"node-libs-browser": "^2.2.1",
20-
"react": "^17.0.2",
21-
"react-dom": "^17.0.2",
20+
"react": "^16.8.4",
21+
"react-dom": "^16.8.4",
2222
"redoc": "2.0.0-rc.53",
2323
"styled-components": "^5.3.0",
2424
"tslib": "^2.2.0",

‎config/webpack-utils.ts

+46
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
import * as webpack from 'webpack';
2+
3+
export function getBabelLoader({useBuiltIns, hot}: {useBuiltIns: boolean, hot?: boolean}) {
4+
return {
5+
loader: 'babel-loader',
6+
options: {
7+
babelrc: false,
8+
sourceType: 'unambiguous',
9+
presets: [
10+
[
11+
'@babel/preset-env',
12+
{
13+
useBuiltIns: useBuiltIns ? 'usage' : false,
14+
corejs: 3,
15+
exclude: ['transform-typeof-symbol'],
16+
targets: 'defaults',
17+
modules: false,
18+
},
19+
],
20+
['@babel/preset-react', { development: false, runtime: 'classic' }],
21+
'@babel/preset-typescript',
22+
],
23+
plugins: [
24+
['@babel/plugin-proposal-decorators', { legacy: true }],
25+
['@babel/plugin-proposal-class-properties', { loose: false }],
26+
[
27+
'@babel/plugin-transform-runtime',
28+
{
29+
corejs: false,
30+
helpers: true,
31+
// eslint-disable-next-line import/no-internal-modules
32+
version: require('@babel/runtime/package.json').version,
33+
regenerator: true,
34+
},
35+
],
36+
'@babel/plugin-proposal-optional-chaining',
37+
'@babel/plugin-proposal-nullish-coalescing-operator',
38+
hot ? 'react-hot-loader/babel' : undefined,
39+
].filter(Boolean)
40+
},
41+
};
42+
}
43+
44+
export function webpackIgnore(regexp) {
45+
return new webpack.NormalModuleReplacementPlugin(regexp, require.resolve('lodash/noop.js'));
46+
}

‎demo/ComboBox.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ const DropDownList = styled.ul`
3131
list-style: none;
3232
margin: 4px 0 0 0;
3333
padding: 5px 0;
34-
font-family: 'Lato';
34+
font-family: Roboto,sans-serif;
3535
overflow: hidden;
3636
`;
3737

‎demo/index.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ const demos = [
1616
label: 'Google Calendar',
1717
},
1818
{ value: 'https://api.apis.guru/v2/specs/slack.com/1.5.0/openapi.yaml', label: 'Slack' },
19-
{ value: 'https://api.apis.guru/v2/specs/zoom.us/2.0.0/swagger.yaml', label: 'Zoom.us' },
19+
{ value: 'https://api.apis.guru/v2/specs/zoom.us/2.0.0/openapi.yaml', label: 'Zoom.us' },
2020
{ value: 'https://docs.graphhopper.com/openapi.json', label: 'GraphHopper' },
2121
];
2222

@@ -154,7 +154,7 @@ const Heading = styled.nav`
154154
155155
display: flex;
156156
align-items: center;
157-
font-family: 'Lato';
157+
font-family: Roboto, sans-serif;
158158
`;
159159

160160
const Logo = styled.img`

‎demo/playground/hmr-playground.tsx

+3-41
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,7 @@
11
import * as React from 'react';
22
import { render } from 'react-dom';
3-
// tslint:disable-next-line
4-
import { AppContainer } from 'react-hot-loader';
5-
// import DevTools from 'mobx-react-devtools';
6-
7-
import { Redoc, RedocProps } from '../../src/components/Redoc/Redoc';
8-
import { AppStore } from '../../src/services/AppStore';
9-
import { RedocRawOptions } from '../../src/services/RedocNormalizedOptions';
10-
import { loadAndBundleSpec } from '../../src/utils/loadAndBundleSpec';
11-
12-
const renderRoot = (props: RedocProps) =>
13-
render(
14-
<AppContainer>
15-
<Redoc {...props} />
16-
</AppContainer>,
17-
document.getElementById('example'),
18-
);
3+
import type { RedocRawOptions } from '../../src/services/RedocNormalizedOptions';
4+
import RedocStandalone from './hot';
195

206
const big = window.location.search.indexOf('big') > -1;
217
const swagger = window.location.search.indexOf('swagger') > -1;
@@ -25,30 +11,6 @@ const userUrl = window.location.search.match(/url=(.*)$/);
2511
const specUrl =
2612
(userUrl && userUrl[1]) || (swagger ? 'swagger.yaml' : big ? 'big-openapi.json' : 'openapi.yaml');
2713

28-
let store;
2914
const options: RedocRawOptions = { nativeScrollbars: false, maxDisplayedEnumValues: 3 };
3015

31-
async function init() {
32-
const spec = await loadAndBundleSpec(specUrl);
33-
store = new AppStore(spec, specUrl, options);
34-
renderRoot({ store });
35-
}
36-
37-
init();
38-
39-
if (module.hot) {
40-
const reload = (reloadStore = false) => async () => {
41-
if (reloadStore) {
42-
// create a new Store
43-
store.dispose();
44-
45-
const state = await store.toJS();
46-
store = AppStore.fromJS(state);
47-
}
48-
49-
renderRoot({ store });
50-
};
51-
52-
module.hot.accept(['../../src/components/Redoc/Redoc'], reload());
53-
module.hot.accept(['../../src/services/AppStore'], reload(true));
54-
}
16+
render(<RedocStandalone specUrl={specUrl} options={options} />, document.getElementById('example'));

‎demo/playground/hot.tsx

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import * as React from 'react';
2+
// eslint-disable-next-line import/no-internal-modules
3+
import { hot } from 'react-hot-loader/root';
4+
import { RedocStandalone as RedocStandaloneOrig, RedocStandaloneProps } from '../../src';
5+
6+
const RedocStandalone = function (props: RedocStandaloneProps) {
7+
return <RedocStandaloneOrig {...props} />;
8+
}
9+
10+
export default hot(RedocStandalone);

‎demo/webpack.config.ts

+37-69
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
import * as CopyWebpackPlugin from 'copy-webpack-plugin';
22
import ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
33
import * as HtmlWebpackPlugin from 'html-webpack-plugin';
4-
import { compact } from 'lodash';
54
import { resolve } from 'path';
65
import * as webpack from 'webpack';
6+
import { getBabelLoader, webpackIgnore } from '../config/webpack-utils';
77

88
const VERSION = JSON.stringify(require('../package.json').version);
99
const REVISION = JSON.stringify(
@@ -14,38 +14,6 @@ function root(filename) {
1414
return resolve(__dirname + '/' + filename);
1515
}
1616

17-
const tsLoader = (env) => ({
18-
loader: 'ts-loader',
19-
options: {
20-
compilerOptions: {
21-
module: env.bench ? 'esnext' : 'es2015',
22-
declaration: false,
23-
},
24-
},
25-
});
26-
27-
const babelLoader = () => ({
28-
loader: 'babel-loader',
29-
options: {
30-
generatorOpts: {
31-
decoratorsBeforeExport: true,
32-
},
33-
plugins: compact([
34-
['@babel/plugin-syntax-typescript', { isTSX: true }],
35-
['@babel/plugin-syntax-decorators', { legacy: true }],
36-
'@babel/plugin-syntax-dynamic-import',
37-
'@babel/plugin-syntax-jsx',
38-
]),
39-
},
40-
});
41-
42-
const babelHotLoader = {
43-
loader: 'babel-loader',
44-
options: {
45-
plugins: ['react-hot-loader/babel'],
46-
},
47-
};
48-
4917
export default (env: { playground?: boolean; bench?: boolean } = {}, { mode }) => ({
5018
entry: [
5119
root('../src/polyfills.ts'),
@@ -57,6 +25,7 @@ export default (env: { playground?: boolean; bench?: boolean } = {}, { mode }) =
5725
: 'index.tsx',
5826
),
5927
],
28+
target: 'web',
6029
output: {
6130
filename: 'redoc-demo.bundle.js',
6231
path: root('dist'),
@@ -69,22 +38,25 @@ export default (env: { playground?: boolean; bench?: boolean } = {}, { mode }) =
6938
port: 9090,
7039
disableHostCheck: true,
7140
stats: 'minimal',
41+
hot: true,
7242
},
7343

7444
resolve: {
7545
extensions: ['.ts', '.tsx', '.js', '.json'],
46+
fallback: {
47+
path: require.resolve('path-browserify'),
48+
http: false,
49+
fs: false,
50+
os: false,
51+
},
7652
alias:
7753
mode !== 'production'
7854
? {
79-
'react-dom': '@hot-loader/react-dom',
80-
}
55+
'react-dom': '@hot-loader/react-dom',
56+
}
8157
: {},
8258
},
8359

84-
node: {
85-
fs: 'empty',
86-
},
87-
8860
performance: false,
8961

9062
externals: {
@@ -101,12 +73,23 @@ export default (env: { playground?: boolean; bench?: boolean } = {}, { mode }) =
10173
{ test: [/\.eot$/, /\.gif$/, /\.woff$/, /\.svg$/, /\.ttf$/], use: 'null-loader' },
10274
{
10375
test: /\.tsx?$/,
104-
use: compact([
105-
mode !== 'production' ? babelHotLoader : undefined,
106-
tsLoader(env),
107-
babelLoader(),
108-
]),
109-
exclude: [/node_modules/],
76+
use: [getBabelLoader({useBuiltIns: true, hot: true} )],
77+
exclude: {
78+
and: [/node_modules/],
79+
not: {
80+
or: [
81+
/swagger2openapi/,
82+
/reftools/,
83+
/openapi-sampler/,
84+
/mobx/,
85+
/oas-resolver/,
86+
/oas-kit-common/,
87+
/oas-schema-walker/,
88+
/\@redocly\/openapi-core/,
89+
/colorette/,
90+
],
91+
},
92+
},
11093
},
11194
{
11295
test: /\.css$/,
@@ -117,46 +100,31 @@ export default (env: { playground?: boolean; bench?: boolean } = {}, { mode }) =
117100
},
118101
},
119102
},
120-
{
121-
test: /node_modules\/(swagger2openapi|reftools|oas-resolver|oas-kit-common|oas-schema-walker)\/.*\.js$/,
122-
use: {
123-
loader: 'ts-loader',
124-
options: {
125-
transpileOnly: true,
126-
instance: 'ts2js-transpiler-only',
127-
compilerOptions: {
128-
allowJs: true,
129-
declaration: false,
130-
},
131-
},
132-
},
133-
},
134103
],
135104
},
136105
plugins: [
137106
new webpack.DefinePlugin({
138107
__REDOC_VERSION__: VERSION,
139108
__REDOC_REVISION__: REVISION,
109+
'process.env': '{}',
110+
'process.platform': '"browser"',
111+
'process.stdout': 'null',
140112
}),
141-
new webpack.NamedModulesPlugin(),
142-
new webpack.optimize.ModuleConcatenationPlugin(),
113+
// new webpack.NamedModulesPlugin(),
114+
// new webpack.optimize.ModuleConcatenationPlugin(),
143115
new HtmlWebpackPlugin({
144116
template: env.playground
145117
? 'demo/playground/index.html'
146118
: env.bench
147119
? 'benchmark/index.html'
148120
: 'demo/index.html',
149121
}),
150-
new ForkTsCheckerWebpackPlugin(),
151-
ignore(/js-yaml\/dumper\.js$/),
152-
ignore(/json-schema-ref-parser\/lib\/dereference\.js/),
153-
ignore(/^\.\/SearchWorker\.worker$/),
122+
new ForkTsCheckerWebpackPlugin({ logger: { infrastructure: 'silent', issues: 'console' } }),
123+
webpackIgnore(/js-yaml\/dumper\.js$/),
124+
webpackIgnore(/json-schema-ref-parser\/lib\/dereference\.js/),
125+
webpackIgnore(/^\.\/SearchWorker\.worker$/),
154126
new CopyWebpackPlugin({
155127
patterns: ['demo/openapi.yaml'],
156128
}),
157129
],
158130
});
159-
160-
function ignore(regexp) {
161-
return new webpack.NormalModuleReplacementPlugin(regexp, require.resolve('lodash/noop.js'));
162-
}

0 commit comments

Comments
 (0)