ElyBy-Mirror/accounts-frontend
1
0
Fork 0
mirror of https://github.com/elyby/accounts-frontend.git synced 2024-11-23 00:22:57 +05:30
Code Issues Packages Projects Releases Wiki Activity

chore(build): enable support for ts declare fields

Browse Source
This commit is contained in:
SleepWalker 2020-10-11 19:33:55 +03:00 committed by ErickSkrauch
parent f7b0c10ba9
commit 79ff3b9410
12 changed files with 1688 additions and 1678 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
babel.config.js
View File

@ -2,16 +2,29 @@
// @ts-nocheck
module.exports = function (api) {
const env = api.env();
api.cache(true);
const isProduction = api.env((envName) => envName.includes('production'));
api.cache.using(() => env);
const browserEnv = {
plugins: ['react-hot-loader/babel'],
presets: [
[
'@babel/preset-env',
{
shippedProposals: true,
ignoreBrowserslistConfig: false,
modules: false,
useBuiltIns: 'usage', // or "entry"
corejs: 3,
include: ['proposal-class-properties'],
},
],
],
};
return {
presets: [
[
'@babel/preset-typescript',
{
allowDeclareFields: true,
},
],
'@babel/preset-react',
[
'@babel/preset-env',
@ -23,11 +36,24 @@ module.exports = function (api) {
modules: 'commonjs',
},
],
[
// NOTE: preset-typescript must go before proposal-class-properties
// in order to use allowDeclareFields option
// proposal-class-properties is enabled by preset-env for browser env
// preset-env for nodejs does not need it, because recent node versions support class fields
//
// but, due to some bugs (?), we must place preset-typescript here so that it loads as
// last default preset, before loading browser presets.
// Only this combination is working without errors
'@babel/preset-typescript',
{
allowDeclareFields: true,
},
],
],
plugins: [
'@babel/plugin-syntax-dynamic-import',
'@babel/plugin-proposal-function-bind',
'@babel/plugin-proposal-class-properties',
'@babel/plugin-proposal-optional-chaining',
'@babel/plugin-transform-runtime',
[
@ -36,25 +62,14 @@ module.exports = function (api) {
removePrefix: 'packages.app',
messagesDir: './build/messages/',
useKey: true,
removeDefaultMessage: env === 'production',
removeDefaultMessage: isProduction,
},
],
],
env: {
webpack: {
plugins: ['react-hot-loader/babel'],
presets: [
[
'@babel/preset-env',
{
ignoreBrowserslistConfig: false,
modules: false,
useBuiltIns: 'usage', // or "entry"
corejs: 3,
},
],
],
},
browser: browserEnv,
'browser-development': browserEnv,
'browser-production': browserEnv,
},
};
};

2
packages/app/components/auth/BaseAuthBody.tsx
View File

@ -15,7 +15,7 @@ class BaseAuthBody extends React.Component<
RouteComponentProps<Record<string, any>>
> {
static contextType = Context;
/* TODO: use declare */ context: React.ContextType<typeof Context>;
declare context: React.ContextType<typeof Context>;
prevErrors: AuthContext['auth']['error'];
autoFocusField: string | null = '';

2
packages/app/components/profile/multiFactorAuth/MfaDisable.tsx
View File

@ -17,7 +17,7 @@ export default class MfaDisable extends React.Component<
}
> {
static contextType = Context;
/* TODO: use declare */ context: React.ContextType<typeof Context>;
declare context: React.ContextType<typeof Context>;
state = {
showForm: false,

2
packages/app/components/profile/multiFactorAuth/MfaEnable.tsx
View File

@ -41,7 +41,7 @@ interface State {
export default class MfaEnable extends React.PureComponent<Props, State> {
static contextType = Context;
/* TODO: use declare */ context: React.ContextType<typeof Context>;
declare context: React.ContextType<typeof Context>;
static defaultProps = {
confirmationForm: new FormModel(),

2
packages/app/pages/profile/ChangeEmailPage.tsx
View File

@ -18,7 +18,7 @@ interface Props extends RouteComponentProps<RouteParams> {
class ChangeEmailPage extends React.Component<Props> {
static contextType = Context;
/* TODO: use declare */ context: React.ContextType<typeof Context>;
declare context: React.ContextType<typeof Context>;
render() {
const { step = 'step1', code } = this.props.match.params;

2
packages/app/pages/profile/ChangePasswordPage.tsx
View File

@ -14,7 +14,7 @@ interface Props {
class ChangePasswordPage extends React.Component<Props> {
static contextType = Context;
/* TODO: use declare */ context: React.ContextType<typeof Context>;
declare context: React.ContextType<typeof Context>;
form = new FormModel();

2
packages/app/pages/profile/ChangeUsernamePage.tsx
View File

@ -14,7 +14,7 @@ type Props = {
class ChangeUsernamePage extends React.Component<Props> {
static contextType = Context;
/* TODO: use declare */ context: React.ContextType<typeof Context>;
declare context: React.ContextType<typeof Context>;
form = new FormModel();

2
packages/app/pages/profile/MultiFactorAuthPage.tsx
View File

@ -16,7 +16,7 @@ interface Props
class MultiFactorAuthPage extends React.Component<Props> {
static contextType = Context;
/* TODO: use declare */ context: React.ContextType<typeof Context>;
declare context: React.ContextType<typeof Context>;
render() {
const {

3
packages/scripts/build-dll.ts
View File

@ -2,7 +2,8 @@
/* eslint-env node */
/* eslint-disable no-console */
import fs, { Stats } from 'fs';
import type { Stats } from 'fs';
import fs from 'fs';
import webpack, { MultiCompiler } from 'webpack';
import chalk from 'chalk';

26
tests-e2e/cypress/plugins/index.js
View File

@ -21,6 +21,7 @@ const wp = require('@cypress/webpack-preprocessor');
// for some reason loader can not locate babel.config. So we load it manually
const config = require('../../../babel.config');
const babelEnvName = 'browser-development';
module.exports = (on) => {
const options = {
@ -39,14 +40,31 @@ module.exports = (on) => {
{
loader: 'babel-loader',
options: {
envName: 'webpack',
envName: babelEnvName,
cacheDirectory: true,
// We don't have the webpack's API object, so just provide necessary methods
...config({
env() {
return 'development';
env(value) {
// see @babel/core/lib/config/helpers/config-api.js
switch (typeof value) {
case 'string':
return value === babelEnvName;
case 'function':
return value(babelEnvName);
case 'undefined':
return babelEnvName;
default:
if (Array.isArray(value)) {
throw new Error('Unimplemented env() argument');
}
throw new Error('Invalid env() argument');
}
},
cache: {
using() {},
},
cache() {},
}),
},
},

7
webpack.config.js
View File

@ -30,13 +30,14 @@ const isCI = !!process.env.CI;
const isSilent = isCI || process.argv.some((arg) => /quiet/.test(arg));
const isCspEnabled = false;
const enableDll = !isProduction && !isStorybook;
const webpackEnv = isProduction ? 'production' : 'development';
process.env.NODE_ENV = isProduction ? 'production' : 'development';
process.env.NODE_ENV = webpackEnv;
const smp = new SpeedMeasurePlugin();
const webpackConfig = {
mode: isProduction ? 'production' : 'development',
mode: webpackEnv,
cache: true,
@ -169,7 +170,7 @@ const webpackConfig = {
{
loader: 'babel-loader',
options: {
envName: 'webpack',
envName: `browser-${webpackEnv}`,
cacheDirectory: true,
},
},

3255
yarn.lock
View File

File diff suppressed because it is too large Load Diff