mirror of
https://github.com/Redocly/redoc.git
synced 2024-11-10 19:06:34 +03:00
chore: add babel-plugin-styled-components (smaller bundle size)
This commit is contained in:
parent
8583547f30
commit
fefe571d29
2
custom.d.ts
vendored
2
custom.d.ts
vendored
|
@ -1,3 +1,5 @@
|
|||
/// <reference path="src/styled.d.ts" />
|
||||
|
||||
declare module '*.json' {
|
||||
const content: any;
|
||||
export = content;
|
||||
|
|
|
@ -1,8 +1,9 @@
|
|||
import * as webpack from 'webpack';
|
||||
import * as HtmlWebpackPlugin from 'html-webpack-plugin';
|
||||
import * as ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin';
|
||||
import * as CopyWebpackPlugin from 'copy-webpack-plugin';
|
||||
import * as CopyWebpackPlugin from 'copy-webpack-plugin';
|
||||
import { resolve } from 'path';
|
||||
import { compact } from 'lodash';
|
||||
|
||||
const VERSION = JSON.stringify(require('../package.json').version);
|
||||
const REVISION = JSON.stringify(
|
||||
|
@ -25,17 +26,24 @@ const tsLoader = env => ({
|
|||
},
|
||||
});
|
||||
|
||||
const babelHotLoader = {
|
||||
const babelLoader = mode => ({
|
||||
loader: 'babel-loader',
|
||||
options: {
|
||||
plugins: [
|
||||
plugins: compact([
|
||||
'@babel/plugin-syntax-typescript',
|
||||
'@babel/plugin-syntax-decorators',
|
||||
'@babel/plugin-syntax-jsx',
|
||||
'react-hot-loader/babel',
|
||||
],
|
||||
mode === 'production' ? 'react-hot-loader/babel' : undefined,
|
||||
[
|
||||
'babel-plugin-styled-components',
|
||||
{
|
||||
minify: true,
|
||||
displayName: mode !== 'production',
|
||||
},
|
||||
],
|
||||
]),
|
||||
},
|
||||
};
|
||||
});
|
||||
|
||||
export default (env: { playground?: boolean; bench?: boolean } = {}, { mode }) => ({
|
||||
entry: [
|
||||
|
@ -76,7 +84,7 @@ export default (env: { playground?: boolean; bench?: boolean } = {}, { mode }) =
|
|||
{ test: [/\.eot$/, /\.gif$/, /\.woff$/, /\.svg$/, /\.ttf$/], use: 'null-loader' },
|
||||
{
|
||||
test: /\.tsx?$/,
|
||||
use: mode === 'production' ? [tsLoader(env)] : [tsLoader(env), babelHotLoader],
|
||||
use: [tsLoader(env), babelLoader(mode)],
|
||||
exclude: ['node_modules'],
|
||||
},
|
||||
{
|
||||
|
@ -115,8 +123,6 @@ export default (env: { playground?: boolean; bench?: boolean } = {}, { mode }) =
|
|||
template: env.playground ? 'demo/playground/index.html' : 'demo/index.html',
|
||||
}),
|
||||
new ForkTsCheckerWebpackPlugin(),
|
||||
new CopyWebpackPlugin([
|
||||
'demo/openapi.yaml'
|
||||
])
|
||||
new CopyWebpackPlugin(['demo/openapi.yaml']),
|
||||
],
|
||||
});
|
||||
|
|
|
@ -69,6 +69,7 @@
|
|||
"@types/webpack-env": "^1.13.0",
|
||||
"@types/yargs": "^11.0.0",
|
||||
"babel-loader": "8.0.0-beta.2",
|
||||
"babel-plugin-styled-components": "^1.5.1",
|
||||
"beautify-benchmark": "^0.2.4",
|
||||
"conventional-changelog-cli": "^1.3.5",
|
||||
"copy-webpack-plugin": "^4.5.1",
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
import { transparentize } from 'polished';
|
||||
import styled from 'styled-components';
|
||||
import styled from '../styled-components';
|
||||
import { PropertyNameCell } from './fields-layout';
|
||||
|
||||
export const ClickablePropertyNameCell = PropertyNameCell.extend`
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import styled, { css } from 'styled-components';
|
||||
import styled, { css } from '../styled-components';
|
||||
|
||||
// tslint:disable-next-line
|
||||
export const linkifyMixin = className => css`
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import { css } from 'styled-components';
|
||||
import { css } from '../styled-components';
|
||||
|
||||
export const deprecatedCss = css`
|
||||
text-decoration: line-through;
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
import * as React from 'react';
|
||||
import styled from 'styled-components';
|
||||
import styled from '../../styled-components';
|
||||
import { ResponseModel } from '../../services/models';
|
||||
import { ResponseView } from './Response';
|
||||
|
||||
|
|
43
src/styled.d.ts
vendored
Normal file
43
src/styled.d.ts
vendored
Normal file
|
@ -0,0 +1,43 @@
|
|||
import * as styledComponents from 'styled-components';
|
||||
|
||||
// Styled components typings for using babel-plugin BEFORE typescript
|
||||
declare module 'styled-components' {
|
||||
interface ThemedStyledFunction<P, T, O = P> {
|
||||
// adding "| string[]" for transpileTemplateLiterals and similar below
|
||||
(
|
||||
strings: TemplateStringsArray | string[],
|
||||
...interpolations: Interpolation<ThemedStyledProps<P, T>>[]
|
||||
): StyledComponentClass<P, T, O>;
|
||||
|
||||
new <U>(
|
||||
strings: TemplateStringsArray | string[],
|
||||
...interpolations: Interpolation<ThemedStyledProps<P & U, T>>[]
|
||||
): StyledComponentClass<P & U, T, O & U>;
|
||||
|
||||
// adding "withConfig" for transpileTemplateLiterals
|
||||
withConfig(config: any): ThemedStyledFunction<P, T, O>;
|
||||
}
|
||||
|
||||
export interface ThemedCssFunction<T> {
|
||||
// adding "| string[]" for transpileTemplateLiterals and similar below
|
||||
(
|
||||
strings: TemplateStringsArray | string[],
|
||||
...interpolations: SimpleInterpolation[]
|
||||
): InterpolationValue[];
|
||||
<P>(
|
||||
strings: TemplateStringsArray | string[],
|
||||
...interpolations: Interpolation<ThemedStyledProps<P, T>>[]
|
||||
): FlattenInterpolation<ThemedStyledProps<P, T>>[];
|
||||
}
|
||||
|
||||
interface ThemedStyledComponentsModule<T> {
|
||||
keyframes(
|
||||
strings: TemplateStringsArray | string[],
|
||||
...interpolations: SimpleInterpolation[]
|
||||
): string;
|
||||
injectGlobal(
|
||||
strings: TemplateStringsArray | string[],
|
||||
...interpolations: SimpleInterpolation[]
|
||||
): void;
|
||||
}
|
||||
}
|
|
@ -21,7 +21,7 @@ const BANNER = `ReDoc - OpenAPI/Swagger-generated API Reference Documentation
|
|||
Version: ${VERSION}
|
||||
Repo: https://github.com/Rebilly/ReDoc`;
|
||||
|
||||
export default (env: { standalone?: boolean } = {}) => ({
|
||||
export default (env: { standalone?: boolean } = {}, { mode }) => ({
|
||||
entry: env.standalone ? ['./src/polyfills.ts', './src/standalone.tsx'] : './src/index.ts',
|
||||
output: {
|
||||
filename: env.standalone ? 'redoc.standalone.js' : 'redoc.lib.js',
|
||||
|
@ -62,14 +62,33 @@ export default (env: { standalone?: boolean } = {}) => ({
|
|||
rules: [
|
||||
{
|
||||
test: /\.tsx?$/,
|
||||
use: {
|
||||
loader: 'ts-loader',
|
||||
options: {
|
||||
compilerOptions: {
|
||||
module: 'es2015',
|
||||
use: [
|
||||
{
|
||||
loader: 'ts-loader',
|
||||
options: {
|
||||
compilerOptions: {
|
||||
module: 'es2015',
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
loader: 'babel-loader',
|
||||
options: {
|
||||
plugins: [
|
||||
'@babel/plugin-syntax-typescript',
|
||||
'@babel/plugin-syntax-decorators',
|
||||
'@babel/plugin-syntax-jsx',
|
||||
[
|
||||
'babel-plugin-styled-components',
|
||||
{
|
||||
minify: true,
|
||||
displayName: mode !== 'production',
|
||||
},
|
||||
],
|
||||
],
|
||||
},
|
||||
},
|
||||
],
|
||||
exclude: ['node_modules'],
|
||||
},
|
||||
{
|
||||
|
|
16
yarn.lock
16
yarn.lock
|
@ -38,6 +38,12 @@
|
|||
source-map "^0.5.0"
|
||||
trim-right "^1.0.1"
|
||||
|
||||
"@babel/helper-annotate-as-pure@^7.0.0-beta.37":
|
||||
version "7.0.0-beta.42"
|
||||
resolved "https://registry.yarnpkg.com/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.0.0-beta.42.tgz#f2b0a3be684018b55fc308eb5408326f78479085"
|
||||
dependencies:
|
||||
"@babel/types" "7.0.0-beta.42"
|
||||
|
||||
"@babel/helper-function-name@7.0.0-beta.42":
|
||||
version "7.0.0-beta.42"
|
||||
resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.0.0-beta.42.tgz#b38b8f4f85168d1812c543dd700b5d549b0c4658"
|
||||
|
@ -919,6 +925,14 @@ babel-plugin-jest-hoist@^22.4.1:
|
|||
version "22.4.1"
|
||||
resolved "https://registry.yarnpkg.com/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-22.4.1.tgz#d712fe5da8b6965f3191dacddbefdbdf4fb66d63"
|
||||
|
||||
babel-plugin-styled-components@^1.5.1:
|
||||
version "1.5.1"
|
||||
resolved "https://registry.yarnpkg.com/babel-plugin-styled-components/-/babel-plugin-styled-components-1.5.1.tgz#31dbeb696d1354d1585e60d66c7905f5e474afcd"
|
||||
dependencies:
|
||||
"@babel/helper-annotate-as-pure" "^7.0.0-beta.37"
|
||||
babel-types "^6.26.0"
|
||||
stylis "^3.0.0"
|
||||
|
||||
babel-plugin-syntax-async-functions@^6.8.0:
|
||||
version "6.13.0"
|
||||
resolved "https://registry.yarnpkg.com/babel-plugin-syntax-async-functions/-/babel-plugin-syntax-async-functions-6.13.0.tgz#cad9cad1191b5ad634bf30ae0872391e0647be95"
|
||||
|
@ -8748,7 +8762,7 @@ stylis-rule-sheet@^0.0.10:
|
|||
version "0.0.10"
|
||||
resolved "https://registry.yarnpkg.com/stylis-rule-sheet/-/stylis-rule-sheet-0.0.10.tgz#44e64a2b076643f4b52e5ff71efc04d8c3c4a430"
|
||||
|
||||
stylis@^3.5.0:
|
||||
stylis@^3.0.0, stylis@^3.5.0:
|
||||
version "3.5.0"
|
||||
resolved "https://registry.yarnpkg.com/stylis/-/stylis-3.5.0.tgz#016fa239663d77f868fef5b67cf201c4b7c701e1"
|
||||
|
||||
|
|
Loading…
Reference in New Issue
Block a user