diff --git a/packages/react-scripts/config/paths.js b/packages/react-scripts/config/paths.js
index c397bb431..4a0163773 100644
--- a/packages/react-scripts/config/paths.js
+++ b/packages/react-scripts/config/paths.js
@@ -59,6 +59,7 @@ module.exports = {
testsSetup: resolveApp('src/setupTests.ts'),
appNodeModules: resolveApp('node_modules'),
appTsConfig: resolveApp('tsconfig.json'),
+ appTsLint: resolveApp('tslint.json'),
publicUrl: getPublicUrl(resolveApp('package.json')),
servedPath: getServedPath(resolveApp('package.json')),
};
@@ -81,6 +82,7 @@ module.exports = {
appNodeModules: resolveApp('node_modules'),
appTsConfig: resolveApp('tsconfig.json'),
appTsTestConfig: resolveApp('tsconfig.test.json'),
+ appTsLint: resolveApp('tslint.json'),
publicUrl: getPublicUrl(resolveApp('package.json')),
servedPath: getServedPath(resolveApp('package.json')),
// These properties only exist before ejecting:
@@ -112,6 +114,7 @@ if (
testsSetup: resolveOwn('template/src/setupTests.ts'),
appNodeModules: resolveOwn('node_modules'),
appTsConfig: resolveOwn('template/tsconfig.json'),
+ appTsLint: resolveOwn('template/tslint.json'),
appTsTestConfig: resolveOwn('template/tsconfig.test.json'),
publicUrl: getPublicUrl(resolveOwn('package.json')),
servedPath: getServedPath(resolveOwn('package.json')),
diff --git a/packages/react-scripts/config/webpack.config.dev.js b/packages/react-scripts/config/webpack.config.dev.js
index f24e0ac46..3cf137781 100644
--- a/packages/react-scripts/config/webpack.config.dev.js
+++ b/packages/react-scripts/config/webpack.config.dev.js
@@ -16,6 +16,7 @@ const CaseSensitivePathsPlugin = require('case-sensitive-paths-webpack-plugin');
const InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin');
const WatchMissingNodeModulesPlugin = require('react-dev-utils/WatchMissingNodeModulesPlugin');
const ModuleScopePlugin = require('react-dev-utils/ModuleScopePlugin');
+const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
const getClientEnvironment = require('./env');
const paths = require('./paths');
@@ -120,14 +121,6 @@ module.exports = {
// We are waiting for https://github.com/facebookincubator/create-react-app/issues/2176.
// { parser: { requireEnsure: false } },
- // First, run the linter.
- // It's important to do this before Babel processes the JS.
- {
- test: /\.(ts|tsx)$/,
- loader: require.resolve('tslint-loader'),
- enforce: 'pre',
- include: paths.appSrc,
- },
{
test: /\.js$/,
loader: require.resolve('source-map-loader'),
@@ -154,7 +147,15 @@ module.exports = {
{
test: /\.(ts|tsx)$/,
include: paths.appSrc,
- loader: require.resolve('ts-loader'),
+ use: [
+ {
+ loader: require.resolve('ts-loader'),
+ options: {
+ // disable type checker - we will use it in fork plugin
+ transpileOnly: true,
+ },
+ },
+ ],
},
// Process JS with Babel.
{
@@ -264,6 +265,13 @@ module.exports = {
// https://github.com/jmblog/how-to-optimize-momentjs-with-webpack
// You can remove this if you don't use Moment.js:
new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
+ // Perform type checking and linting in a separate process to speed up compilation
+ new ForkTsCheckerWebpackPlugin({
+ async: false,
+ watch: paths.appSrc,
+ tsconfig: paths.appTsConfig,
+ tslint: paths.appTsLint,
+ }),
],
// Some libraries import Node modules but don't use them in the browser.
// Tell Webpack to provide empty mocks for them so importing them works.
diff --git a/packages/react-scripts/config/webpack.config.prod.js b/packages/react-scripts/config/webpack.config.prod.js
index a9d9e13e0..8badecf54 100644
--- a/packages/react-scripts/config/webpack.config.prod.js
+++ b/packages/react-scripts/config/webpack.config.prod.js
@@ -17,6 +17,7 @@ const ManifestPlugin = require('webpack-manifest-plugin');
const InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin');
const SWPrecacheWebpackPlugin = require('sw-precache-webpack-plugin');
const ModuleScopePlugin = require('react-dev-utils/ModuleScopePlugin');
+const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
const paths = require('./paths');
const getClientEnvironment = require('./env');
@@ -125,15 +126,6 @@ module.exports = {
// TODO: Disable require.ensure as it's not a standard language feature.
// We are waiting for https://github.com/facebookincubator/create-react-app/issues/2176.
// { parser: { requireEnsure: false } },
-
- // First, run the linter.
- // It's important to do this before Babel processes the JS.
- {
- test: /\.(ts|tsx)$/,
- loader: require.resolve('tslint-loader'),
- enforce: 'pre',
- include: paths.appSrc,
- },
{
test: /\.js$/,
loader: require.resolve('source-map-loader'),
@@ -155,11 +147,19 @@ module.exports = {
name: 'static/media/[name].[hash:8].[ext]',
},
},
- //Compile .tsx?
+ // Compile .tsx?
{
test: /\.(ts|tsx)$/,
include: paths.appSrc,
- loader: require.resolve('ts-loader')
+ use: [
+ {
+ loader: require.resolve('ts-loader'),
+ options: {
+ // disable type checker - we will use it in fork plugin
+ transpileOnly: true,
+ },
+ },
+ ],
},
// Process JS with Babel.
{
@@ -350,6 +350,12 @@ module.exports = {
// https://github.com/jmblog/how-to-optimize-momentjs-with-webpack
// You can remove this if you don't use Moment.js:
new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
+ // Perform type checking and linting in a separate process to speed up compilation
+ new ForkTsCheckerWebpackPlugin({
+ async: false,
+ tsconfig: paths.appTsConfig,
+ tslint: paths.appTsLint,
+ }),
],
// Some libraries import Node modules but don't use them in the browser.
// Tell Webpack to provide empty mocks for them so importing them works.
diff --git a/packages/react-scripts/package.json b/packages/react-scripts/package.json
index 734bdf8b1..1f953c07e 100644
--- a/packages/react-scripts/package.json
+++ b/packages/react-scripts/package.json
@@ -34,6 +34,7 @@
"dotenv": "4.0.0",
"extract-text-webpack-plugin": "3.0.2",
"file-loader": "1.1.5",
+ "fork-ts-checker-webpack-plugin": "^0.2.8",
"fs-extra": "3.0.1",
"html-webpack-plugin": "2.29.0",
"jest": "20.0.4",
@@ -53,7 +54,6 @@
"ts-jest": "^21.1.4",
"ts-loader": "^3.1.1",
"tslint": "^5.8.0",
- "tslint-loader": "^3.5.3",
"tslint-react": "^3.2.0",
"typescript": "~2.6.1",
"source-map-loader": "^0.2.3"
pFad - Phonifier reborn
Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.
Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.
Alternative Proxies:
Alternative Proxy
pFad Proxy
pFad v3 Proxy
pFad v4 Proxy