Не удается импортировать современные-релейные сети в кипарис - PullRequest
Новая
       15

Не удается импортировать современные-релейные сети в кипарис

0 голосов
/ 04 октября 2018

Проблема

Привет, ребята,

Я использую TypeScript 3.0.3 с Кипарис и пытаюсь загрузить react-relay-network-modernМодуль в моем компоненте.Тем не менее, он всегда говорит мне, что модуль не существует, хотя он находится в моей папке node_modules и определен в моем package.json .У меня нет ошибок с relay-runtime, и реле работает нормально.

Когда я выполняю обычный импорт следующим образом: 

import * as RelayNetworkModern from 'react-relay-network-modern';

Я получаю следующую ошибку, что модуль былне найден. 

/src/relayEnvironment.ts
[tsl] ERROR in /src/relayEnvironment.ts(8,37)
      TS2307: Cannot find module 'react-relay-network-modern'.

Даже когда я устанавливаю псевдонимы в моем tsconfig.json и препроцессоре веб-пакета или импортирую подпапки react-relay-network-modern/(es|lib|...), я получаю одинаковые ошибки.

Конфиг

Я полагаю, что было бы лучше добавить мои файлы конфигурации:

/ cypress / plugins / webpack.config.js 

const webpack = require( '@cypress/webpack-preprocessor' );
const path = require('path');

const options = {
  watchOptions: {},
  webpackOptions: {
    resolve: {
      extensions: [ '.web.js', '.js', '.json', '.web.jsx', '.jsx', '.tsx', '.ts', '.mjs' ],
      modules: [
        path.resolve( __dirname, '../../node_modules' ),
        path.resolve( __dirname, '../../src' ),
      ],
      alias: {
        'react-relay-network-modern': path.resolve( __dirname, '../../node_modules/react-relay-network-modern/es' ),
        src: path.resolve( __dirname, '../../src' ),
      }
    },
    module: {
      rules: [
        {
          type: 'javascript/auto',
          test: /\.mjs$/,
          include: /node_modules/,
          use: [],
        },
        {
          test: /\.ts(x)?$/,
          exclude: [ /node_modules/ ],
          use: [
            {
              loader: 'babel-loader',
              options: {
                presets: [ '@babel/preset-react' ],
                plugins: [ 'relay' ],
              },
            },
            {
              loader: 'ts-loader',
            },
          ],
        },
      ],
    },
  },
};

module.exports = webpack( options );

/ tsconfig.json 

{
  "compilerOptions": {
    "baseUrl": ".",
    "target": "es6",
    "jsx": "react",
    "skipLibCheck": true,
    "noImplicitAny": false,
    "strict": true,
    "lib": ["dom", "es6", "es2016", "es2017.object"],
    "types": [ "cypress", "react" ],
    "typeRoots": [ "node_modules/@types", "types" ],
    "paths" : {
      "react": ["node_modules/@types/react"],
      "react-relay-network-modern": ["node_modules/react-relay-network-modern/es"],
      "src/*": ["src/*"],
      "components/*": ["src/*"]
    }
  },
  "include": [
    "node_modules/cypress",
    "src/*/*.ts"
  ]
}

1 Ответ

0 голосов
/ 04 октября 2018

Ладно, после большого количества попыток и тестирования нескольких опций tsconfig я понял это.

Оказалось, что мне просто нужно было установить следующие 2 опции в моем tsconfig: 

    "allowJs": true,
    "moduleResolution": "node"

Итак, мой новый tsconfig.json выглядит примерно так: 

{
  "compilerOptions": {
    "baseUrl": ".",
    "target": "es6",
    "jsx": "React",
    "skipLibCheck": true,
    "noImplicitAny": false,
    "strict": true,
    "allowJs": true,
    "moduleResolution": "node",
    "lib": ["dom", "es6", "es2016", "es2017.object"],
    "types": [ "cypress", "react" ],
    "typeRoots": [ "node_modules/@types", "types" ],
    "paths" : {
      "react": ["node_modules/@types/react"],
      "src/*": ["src/*"],
      "components/*": ["src/*"]
    }
  },
  "include": [
    "node_modules/cypress",
    "src/*/*.ts"
  ]
}
...