时间戳

首页 > 解决方案 > 为什么在 React 中没有正确加载一个类？

node.js - 为什么在 React 中没有正确加载一个类？

问题描述

在我的应用程序中，我使用 React on Rails 和 webpack 来构建它。

我将 OSX 与 VSCode 一起使用。当我尝试从我的文件中导入我的 Redux Store 时，我得到一个奇怪的“未捕获的错误：找不到模块”../../bundles/store”。

但是在下一行，同一个文件，导入是正确的。

这是我的客户端/应用程序/组件/wallbuilder/wallbuilder.jsx 进口：

import { store as STORE } from "../../bundles/store";
import { enclosure } from "../../bundles/store/action_creators.jsx";

这里是我的 client/app/bundles/store.jsx 文件：

import {createStore, combineReducers} from 'redux';

// Note: this file is not very decomposed on purpose.
// Start splitting only if this is unwieldy to handle

function counter(state = 0, action) {
  switch (action.type) {
    case 'INCREMENT':
      return state + 1
    case 'DECREMENT':
      return state - 1
    default:
      return state
  }
}
// Enclosure
import * as ACTIONS from './store/actions.jsx';
const ENCLOSURE_INITIAL = {cladding: '', type: '', showFilters: true};

function enclosure(state = ENCLOSURE_INITIAL, action) {
  switch(action.type) {
  case ACTIONS.ENCLOSURE_SET_CLADDING:
    return Object.assign({}, state, {cladding: action.value})
  case ACTIONS.ENCLOSURE_SET_TYPE:
    return Object.assign({}, state, {type: action.value})
  case ACTIONS.ENCLOSURE_SHOW_FILTERS:
    return Object.assign({}, state, {showFilters: action.value})
  default:
    return state;
  }

}



export const store = createStore(combineReducers({counter, enclosure}));

尝试导入 {store as STORE } 的这一行是被破坏的行。

在我的文件夹/文件上。

那么，我的 wallbuilder 文件中没有正确加载商店的选项有哪些？

标签： node.jsreactjswebpack

解决方案

我认为你在这里犯了一个小错误。JSX 是 react jsx 语法的扩展，但你的代码只是 js 代码，所以你需要像这样将文件扩展名更改为 js

import { enclosure } from "../../bundles/store/action_creators.js";

推荐阅读