javascript 未找到模块:错误:无法解析模块'functions'

iyr7buue  于 12个月前  发布在  Java
关注(0)|答案(6)|浏览(103)

我得到的错误如下所述。我不知道哪里做错了。请帮帮我。我已经改变了我的webpack配置也,我也更新了react-hot-webpack加载器也,但我仍然得到这些错误。
先谢了。
这些是我得到的错误。

ERROR in ./~/redux-form/lib/reduxForm.js
Module not found: Error: Cannot resolve module 'react-redux' in /home/priyanka/Finalproject/node_modules/redux-form/lib
 @ ./~/redux-form/lib/reduxForm.js 27:18-40

ERROR in ./~/redux-form/lib/values.js
Module not found: Error: Cannot resolve module 'react-redux' in /home/priyanka/Finalproject/node_modules/redux-form/lib
 @ ./~/redux-form/lib/values.js 9:18-40

ERROR in ./~/redux-form/lib/ConnectedField.js
Module not found: Error: Cannot resolve module 'react-redux' in /home/priyanka/Finalproject/node_modules/redux-form/lib
 @ ./~/redux-form/lib/ConnectedField.js 13:18-40

这是我的React代码

import { createStore, combineReducers } from 'redux'
import { reducer as formReducer } from 'redux-form'
import React, { Component } from 'react';
import { reduxForm } from 'redux-form';
const reducers = {
  // ... your other reducers here ...
  form: formReducer     // <---- Mounted at 'form'
}
const reducer = combineReducers(reducers)
const store = createStore(reducer)

class ContactForm extends Component {
  render() {
    const { handleSubmit } = this.props;
    return (
      <form onSubmit={handleSubmit}>
        <div>
          <label>First Name</label>
          <Field name="firstName" component={React.DOM.input} type="text"/>
        </div>
        <div>
          <label>Last Name</label>
          <Field name="lastName" component={React.DOM.input} type="text"/>
        </div>
        <div>
          <label>Email</label>
          <Field name="email" component={React.DOM.input} type="email"/>
        </div>
        <button type="submit">Submit</button>
      </form>
    );
  }
}

// Decorate the form component
ContactForm = reduxForm({
  form: 'contact' // a unique name for this form
})(ContactForm);

export default ContactForm;

这是我的webpack

module.exports = {
  entry: './src/index.js',
  output: {
    path: __dirname + '/public',
    filename: 'bundle.js'
  },
  module: {
    loaders: [
      {
        test: /\.json$/,
        loader: 'json-loader'
      },
{ test: /\.(png|jpg)$/, loader: 'url-loader?limit=8192' },

      {
        test: /\.js$/,
        loader: 'babel-loader',
        exclude: /(node_modules|lib\/ckeditor)/
      },
      {
        test: /\.s?css$/,
       loaders: ['style-loader','css-loader','sass-loader']
     }

    ]
  },
  resolve: {
  alias: { 'react/lib/ReactMount': 'react-dom/lib/ReactMount' }
}
};
nzk0hqpo

nzk0hqpo1#

npm install react-redux  --save

这应该能解决问题

c2e8gylq

c2e8gylq2#

我想你还没有安装'react-redux'包。请确保它在您的package.json文件中。如果没有,请使用“npm install --save react-redux”安装

mzsu5hc0

mzsu5hc03#

所以我在尝试将redux-form集成到react-boilerplate时遇到了这个问题。
这可能与您尝试将redux-form与配置为使用ImmutableJS对象的Redux存储一起使用时的情况有关。
请参阅docs。从版本6开始,这是官方支持的。

TL;DR

1)你必须有特殊的进口:

// reducer registration:
import formReducer from 'redux-form/immutable';

// form implementation:
import { Field, reduxForm } from 'redux-form/immutable' // <--- immutable import

2)在实现验证时,您应该记住非标准对象的性质:

const validate = values => {
  // IMPORTANT: values is an Immutable.Map here!
  const errors = {};
  if (!values.get('username')) {
    errors.username = 'Required'
  }
  return errors;
mzillmmw

mzillmmw4#

它可以运行这两个命令

npm install react-redux  --save

然后必须运行第二个命令

npm install --save redux-form
xqkwcwgp

xqkwcwgp5#

如果你使用"@reduxjs/toolkit"。你会得到这个错误。
因此,不需要将redux添加到packages.json
你只需要这些"@reduxjs/toolkit""react-redux"
要解决此问题,请删除node_modules中的所有文件夹,然后执行npm i
它会解决问题。
样品package.json

"devDependencies": {
    "parcel": "^2.9.3",
    "postcss": "^8.4.31",
    "process": "^0.11.10",
    "tailwindcss": "^3.3.3"
  },
  "dependencies": {
    "@reduxjs/toolkit": "^1.9.7",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-redux": "^8.1.3",
    "react-router-dom": "^6.16.0"
  }
hxzsmxv2

hxzsmxv26#

这为我解决了问题。

npm install --save redux-form

相关问题