craco вызывает сбой сборки пряжи из-за «Не удается найти модуль« среда ». TS2307» - PullRequest
Новая
       38

craco вызывает сбой сборки пряжи из-за «Не удается найти модуль« среда ». TS2307»

0 голосов
/ 19 января 2020

Я установил и настроил craco, следуя официальной README и средней статье «Мои переменные настраиваемой переменной среды Reacts» . Я сделал

  • sudo yarn global upgrade create-react-app
  • create-react-app craco-getting-started
  • yarn add react-scripts typescript @types/react @types/react-dom

И создал необходимые файлы

public/index.html: 

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>Craco getting started</title>
  </head>
  <body>
    <div id="root"></div>
  </body>
</html>

src/App.tsx: 

import React from "react"

class App extends React.Component {

  render() {
    return <div>Hello world!</div>
  }
}

export { App };

src/index.tsx: 

import React from "react";
import ReactDOM from "react-dom";
import { App } from "./App";

ReactDOM.render(
  <App/>,
  document.getElementById("root")
);

и добавлено 

"scripts": {
  "start": "react-scripts start",
  "build": "react-scripts build"
}

до package.json.

Пока что так, шаблонно. Приложение запускается с yarn start и отображает «Hello world!».

Теперь я настраиваю craco, создав src/environments/development.ts с 

export default {
  isProduction: false,
  name: "development"
};

и src/environments/production.ts с 

export default {
  isProduction: true,
  name: "production"
};

, а также craco.config.js с содержимым 

const path = require('path');

module.exports = function({ env, paths }) {
  return {
    webpack: {
      alias: {
        environment: path.join(__dirname, 'src', 'environments', process.env.CLIENT_ENV)
      }
    },
  };
};

и установкой craco с yarn add @craco/craco --dev и cross-env с yarn add cross-env.

Теперь, если я хочу использовать ссылку на среду для доступа environment.someKey, например, в App, мне нужно добавить import environment from "environment"; в src/App.tsx, но это приводит к сбою yarn build и yarn start из-за 

> yarn build
yarn run v1.21.1
$ cross-env CLIENT_ENV=production craco build
Creating an optimized production build...
Failed to compile.

/mnt/data/home/examples/craco/craco-getting-started/src/App.tsx
TypeScript error in /mnt/data/home/examples/craco/craco-getting-started/src/App.tsx(2,25):
Cannot find module 'environment'.  TS2307

    1 | import React from "react"
  > 2 | import environment from "environment";
      |                         ^
    3 | 
    4 | class App extends React.Component {
    5 | 


error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Как я могу использовать эту созданную настройку?

Я предоставляю SSCCE на https://gitlab.com/krichter-sscce/craco-getting-started, который не содержит никакой дополнительной информации, но позволяет гораздо проще воспроизвести проблему.

1 Ответ

0 голосов
/ 22 января 2020

После добавления @craco/craco необходимо обновить package.json сценарии до 

 "scripts": {
    "start": "CLIENT_ENV=development craco start",
    "build": "CLIENT_ENV=production craco build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
...