Игнорировать файлы .d.ts для Webpack / Babel? - PullRequest
0 голосов
/ 19 февраля 2020

Я использую @teamsupercell/typings-for-css-modules-loader для генерации типов TS для моих модулей SASS. Вывод выглядит примерно так:

declare namespace LoginRouteStylesScssModule {
  export interface ILoginRouteStylesScss {
    card: string;
    emailForm: string;
    info: string;
    input: string;
  }
}

declare const LoginRouteStylesScssModule: LoginRouteStylesScssModule.ILoginRouteStylesScss & {
  /** WARNING: Only available when `css-loader` is used without `style-loader` or `mini-css-extract-plugin` */
  locals: LoginRouteStylesScssModule.ILoginRouteStylesScss;
};

export = LoginRouteStylesScssModule;

Это позволяет ему пройти tsc. Тем не менее, Бабель говорит мне 'export =' is not supported by @babel/plugin-transform-typescript. Please consider using 'export <value>;'. Я хочу просто игнорировать .d.ts файлы, так как они предназначены для tsc, а не для Webpack / Babel.

Я пытался exclude в .babelrc, exclude и ignore в webpack.config.js и webpack.IgnorePlugin, но ни один из них не работает. Как настроить Webpack или Babel, чтобы они игнорировались?

`webpack.config. js ':

const path = require('path');
const childProcess = require('child_process');
const webpack = require('webpack');

const APP_ROOT = path.resolve('./src');

module.exports = {
  entry: {
    index: path.resolve('./src/main.tsx'),
  },
  output: {
    path: path.resolve('./public/js'),
    publicPath: '/js/',
  },
  module: {
    rules: [
      {
        test: /\.(j|t)sx?$/,
        include: [APP_ROOT],
        exclude: [path.resolve('./node_modules')],
        use: {
          loader: 'babel-loader',
          options: {},
        },
      },
      {
        test: /\.s?css$/,
        include: [APP_ROOT],
        exclude: [/node_modules/],
        use: [
          '@teamsupercell/typings-for-css-modules-loader',
          {
            loader: 'css-loader',
            options: {
              importLoaders: 1,
              modules: {
                localIdentName: '[name]__[local]',
              },
            },
          },
          'postcss-loader',
          'sass-loader',
          {
            loader: 'sass-resources-loader',
            options: {
              resources: [
                path.resolve('./src/styles/imports/variables.scss'),
                path.resolve('./src/styles/imports/mixins.scss'),
              ],
            },
          },
        ],
      },
      {
        test: /\.png$/,
        use: [
          'file-loader?name=../css/sprites/[name].png',
        ],
      },
    ],
  },
  resolve: {
    modules: [APP_ROOT, path.resolve('./node_modules')],
    extensions: ['.js', '.jsx', '.ts', '.tsx'],
    alias: {
      sprites: path.resolve('./public/css/sprites'),
    },
  },
  optimization: {},
  context: APP_ROOT,
  plugins: [
    new webpack.optimize.ModuleConcatenationPlugin(),
    new webpack.DefinePlugin({
      MODULE_CONFIG: null,
    }),
    new webpack.EnvironmentPlugin({
      NODE_ENV_ACTUAL: process.env.NODE_ENV || null,
      API_URL: process.env.API_URL || null,
      ASSETS_URL: process.env.ASSETS_URL || null,
      JS_VERSION: parseInt(
        (childProcess.execSync('git rev-list --count master').toString()).trim(),
        10,
      ),
    }),
  ],
  cache: true,
  devtool: false,
  watchOptions: {
    ignored: [
      path.resolve('./public'),
      path.resolve('./src/styles/generated/**'),
      path.resolve('./src/**/*.d.ts'),
    ],
  },
};

babel.config.js:

module.exports = {
  presets: [
    ['@babel/preset-env', {
      useBuiltIns: 'usage',
      corejs: '3',
      exclude: [
        'babel-plugin-transform-async-to-generator',
        'babel-plugin-transform-regenerator',
      ],
    }],
    '@babel/preset-typescript',
  ],
  plugins: [
    '@babel/plugin-syntax-dynamic-import',
    ['@babel/plugin-transform-react-jsx', { pragma: 'h' }],
    '@babel/plugin-proposal-do-expressions',
    '@babel/plugin-proposal-class-properties',
    '@babel/plugin-proposal-optional-chaining',
    /* Async/await increases file size by a lot.
    ["module:fast-async", {
      "compiler": { "promises": true, "generators": false, "useRuntimeModule": true },
    }],
    ["@babel/plugin-transform-modules-commonjs", {
      "strictMode": false,
    }], */
  ],
  env: {
    production: {
      plugins: ['transform-react-remove-prop-types'],
    },
  },
};
...