Question

注意：我制作了一个git repo，因此可以复制该问题 https://github.com/giovannicode/formsy-import-test

我正在尝试将reacty-react库用于react js项目。

但我无法导入文件。我是webpack和ES6的新手，所以我不确定我是否遗漏了一些重要内容。这是我的.babelrc文件：

{
"presets": [
"es2015", "react"
 ]
}

这是我的webpack.config.js文件：

var path = require("path");

module.exports = {
  resolve: {
    extensions: ['', '.js', '.jsx'],
  },
  //externals: 'react',
  entry: {
    'app': './app.jsx',
  },
  output: {
    path: __dirname,
    filename: "[name].js"
  },
  module: {
    loaders: [
      {
        test: /\.jsx$/,
        include: __dirname,
        loader: "babel-loader"
      },
    ]
  }
}

这是我的app.jsx文件：

import React from 'react';  
import ReactDOM from 'react-dom';

import {Formsy} from 'formsy-react';

var CommentBox = React.createClass({
  render: function() {
    return (
      <div className="commentBox">
        Hello, world! I am a CommentBox.
      </div>
    );
  }
});

ReactDOM.render(
  <CommentBox />,
  document.getElementById('react-content')
);

如果我注释掉formy-react导入，该应用程序将正常工作。但是当我添加导入时，我在浏览器中跟随错误：

Uncaught TypeError: Cannot read property 'React' of undefined

应用程序将通过webpack进行编译而不会出错，因此我不确定发生了什么。

注意：我制作了一个git repo，因此可以复制该问题 https://github.com/giovannicode/formsy-import-test

Answer 1

您正尝试以两种方式导入依赖项，

从ES6和

导入模块

import Formsy from 'forms-react'

并使用require

加载模块

var React = require('react');

观察你的代码你可能想要使用ES6语法

import React from 'react'
import Formsy from 'forms-react'

尝试导入formy-react时出错。无法读取未定义的属性“React”

1 个答案: