'rollup-plugin-node-resol' не может работать с `useState` ofact, как это исправить? - PullRequest
0 голосов
/ 15 марта 2019

В проекте машинописного текста я использую typescript + rollup + rollup-plugin-node-resolve + React's useState вместе, но при запуске rollup -c выдает ошибку:

1: import {useState} from "react";
           ^
2: 
Error: 'useState' is not exported by node_modules/react/index.js

Мой код довольно прост:

import {useState} from "react";

console.log(useState);

А rollup.config.js это:

import commonjs from 'rollup-plugin-commonjs';
import resolve from 'rollup-plugin-node-resolve';
import typescript from 'rollup-plugin-typescript2';

export default {
  input: 'index.ts',
  output: [
    {
      file: 'bundle.js',
      format: 'cjs',
    }
  ],
  plugins: [
    resolve(),
    commonjs(),
    typescript(),
  ]
};

package.json is:

{
  "scripts": {
    "demo": "rollup -c && node bundle.js"
  },
  "dependencies": {
    "react": "16.8.4"
  },
  "devDependencies": {
    "@types/react": "16.8.8",
    "rollup": "1.6.0",
    "rollup-plugin-commonjs": "9.2.1",
    "rollup-plugin-node-resolve": "4.0.1",
    "rollup-plugin-typescript2": "0.20.1",
    "typescript": "3.3.3333"
  }
}

tsconfig.json

{
  "compilerOptions": {
    "strict": true,
    "target": "es6",
    "module": "esnext",
    "noImplicitAny": true,
    "removeComments": true,
    "preserveConstEnums": true,
    "moduleResolution": "node",
    "sourceMap": true,
    "jsx": "react",
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true
  }
}

Если я удалю resolve() из rollup.config.js, накопительный пакет будет корректно связан Но мне нужно использовать resolve() в моем реальном проекте.

Где не так и как это исправить?

PS: Демонстрация полного кода здесь: https://github.com/freewind-demos/typescript-react-rollup-use-state-demo

1 Ответ

2 голосов
/ 18 марта 2019

Как ссылка ответа, предоставленная @Tholle, проблема в том, что rollup-plugin-commonjs не может найти экспорт setState из реакции, так как реакция объявляет его как:

const React = {
    setState
}
module.exports = React

rollup-plugin-commonjs не может обрабатывать такую ​​форму экспорта, поэтому мы должны определить некоторые именованные экспорты в rollup.config.js, например:

plugins: [
   'react': ['useState']
]
...