Mocha 无法识别导入中的 React

Question

我正在尝试将 Mocha 合并到 React/Node 应用程序中，但在我的 test.js 文件中调用 React 时遇到了一些问题

package.json

{
  "name": "blog_frontend",
  "version": "1.0.0",
  "description": "front end app for react to connect to rails api",
  "main": "index.js",
  "scripts": {
    "start": "webpack-dev-server --progress --color --watch --mode=development",
    "test": "./node_modules/mocha/bin/mocha"
  },
  "babel": {
    "presets": [
      "es2015",
      "react"
    ],
    "plugins": "transform-es2015-modules-amd"
  },
  "license": "MIT",
  "devDependencies": {
    "babel-core": "^6.26.3",
    "babel-loader": "^7.1.5",
    "babel-plugin-transform-runtime": "^6.23.0",
    "babel-preset-env": "^1.7.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "babel-preset-stage-0": "^6.24.1",
    "babel-preset-stage-1": "^6.24.1",
    "chai": "^4.1.2",
    "css-loader": "^1.0.0",
    "enzyme": "^3.5.0",
    "html-loader": "^0.5.5",
    "mocha": "^5.2.0",
    "sass-loader": "^7.1.0",
    "sinon": "^6.1.5",
    "style-loader": "^0.21.0",
    "webpack": "^4.17.0",
    "webpack-cli": "^3.0.8",
    "webpack-dev-server": "^3.1.4"
  },
  "dependencies": {
    "babel-plugin-transform-decorators-legacy": "^1.3.5",
    "html-webpack-plugin": "^3.2.0",
    "mobx": "^5.0.4",
    "mobx-react": "^5.2.5",
    "node-sass": "^4.9.3",
    "purecss": "^1.0.0",
    "react": "^15.1.0",
    "react-css-modules": "^4.7.7",
    "react-dom": "^15.1.0",
    "react-ellipsis-text": "^1.0.0",
    "react-router": "^3.0.0"
  }
}

test/collection.test.js 文件

import React from 'react';
import { mount, shallow } from 'enzyme';
import {expect} from 'chai';

import Collection from '../app/components/Collection.js'

describe('Collection', function() {
  it('should have props for photos', function() {
    const wrapper = shallow(<Collection />); 
    expect(wrapper.props().photos).to.be.defined;
  });
});

error message

我试过谷歌搜索，但大多数其他帖子都存在 import 关键字的问题，而我的帖子特别关注 React。我已经尝试在 .babelrc 中安装不同的包和调整设置，但我没有取得任何成功。任何信息表示赞赏

Answer 1

ES 模块用于测试，它们不是本机 Node.mjs 模块，Mocha 未配置为使用 Babel 转换 .js 文件。测试代码还会有其他问题，例如class Node 本身不支持的字段。

Mocha 应该配置为与 Babel 一起使用，例如the reference 建议：

"test": "./node_modules/mocha/bin/mocha --require babel-core/register"

在项目根目录中也应该可以访问适当的 .babelrc 配置。

Mocha 无法识别导入中的 React

Mocha can't recognize React in import

mocha.js

reactjs

webpack

babeljs