Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/reactjs/21.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/4/webpack/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Reactjs 导入在网页包内不起作用_Reactjs_Webpack_Import_Babeljs_Babel Loader - Fatal编程技术网

Reactjs 导入在网页包内不起作用

Reactjs 导入在网页包内不起作用,reactjs,webpack,import,babeljs,babel-loader,Reactjs,Webpack,Import,Babeljs,Babel Loader,我是新的网页,所以很抱歉,如果我错过了一些非常明显的 我的结构如下: adex_js ---- app.jsx (entry point) ---- TestComponent.jsx 在app.jsx中,我有: import TestComponent from './TestComponent' 我得到: ERROR in ./js/adex_js/app.jsx Module not found: Error: Can't resolve './TestComponent'

我是新的网页,所以很抱歉,如果我错过了一些非常明显的

我的结构如下:

adex_js
   ---- app.jsx (entry point)
   ---- TestComponent.jsx
在app.jsx中,我有:

import TestComponent from './TestComponent'
我得到:

ERROR in ./js/adex_js/app.jsx
Module not found: Error: Can't resolve './TestComponent' in '.........../asset_src/js/adex_js'
我被告知可能与巴别塔的配置有关。。。这是我的。巴别LRC:

{
   "env": {
     "production": {
      "plugins": [
        "transform-react-remove-prop-types",
        "transform-react-constant-elements"
      ]
    },
    "development": {
      "sourceMaps": "inline"
    },
    "test": {
      "plugins": [
        "istanbul"
      ],
      "sourceMaps": "inline",
      "presets": [
        [
          "env",
          {
            "targets": {
              "browsers": [
                "last 2 versions",
                "safari >= 7"
              ],
              "node": "current"
            },
            "useBuiltIns": true,
            "debug": true
          }
        ],
        "react",
        "stage-0"
      ]
    }
  },
  "plugins": [
    "transform-class-properties",
    "transform-runtime",
    "transform-object-rest-spread",
    "transform-decorators-legacy",
    "syntax-dynamic-import",
    "dynamic-import-node",
    "react-hot-loader/babel",
    [
      "react-css-modules",
      {
        "generateScopedName": "[name]__[local]___[hash:base64:5]"
      }
    ],
  ],
  "presets": [
    [
      "env",
      {
        "targets": {
          "browsers": [
            "last 2 versions",
            "safari >= 7"
          ],
          "node": "current"
        },
        "modules": false,
        "useBuiltIns": true,
        "debug": false
      }
    ],
    "react",
    "stage-0"
  ]
}
以及网页配置中的babel部分:

 {
    test: /\.jsx?$/,
    exclude: /(node_modules|bower_components)/,
    loader: 'babel-loader',
    query: {
      plugins: [
        'transform-react-jsx',
        [
          'react-css-modules',
          {
            context,
            generateScopedName: '[name]__[local]___[hash:base64:5]'
          }
        ]
      ]
    }
你知道是什么导致了这个问题吗?我没有收到任何其他错误,似乎都安装得很好,导入react工作正常,只有从文件系统导入时才会失败


任何提示都是非常受欢迎的

在导入中使用完整的文件名:

import TestComponent from './TestComponent.jsx'

在导入中使用完整的文件名:

import TestComponent from './TestComponent.jsx'

添加扩展成功了,但更好的解决方案是添加:

resolve: {
    extensions: ['.js', '.jsx'],
},

在我的webpack配置文件中,我不再需要在导入中添加扩展名…

添加扩展名有效,但更好的解决方案是添加:

resolve: {
    extensions: ['.js', '.jsx'],
},
在我的网页配置文件中,我不再需要在导入中添加扩展名