javascript - 找不到模块 : Can't resolve: Material-UI

Question

已关闭。这个问题是 not reproducible or was caused by typos 。目前不接受答案。

---

这个问题是由拼写错误或无法再重现的问题引起的。虽然类似的问题可能是 on-topic在这里，这个问题的解决方式不太可能帮助 future 的读者。

已关闭 2 年前。

Improve this question

这就是我遇到的错误:

Failed to compile ./node_modules/@material-ui/core/Modal/Modal.js Module not found: Can't resolve '@babel/runtime/helpers/builtin/assertThisInitialized' in 'C:\Users\rifat\Desktop\waves\client\node_modules@material-ui\core\Modal'

此错误发生在构建期间，无法消除。

这是node_modules文件夹:

看起来路径是正确的，为什么react会提示。

这是我的文件:

import React, { Component } from 'react';
import FormField from '../utils/Form/formfield';
import { update, generateData, isFormValid } from 
'../utils/Form/formActions';
import Dialog from '@material-ui/core/Dialog';

import { connect } from 'react-redux';
import { registerUser } from '../../actions/user_actions';

class Register extends Component {

state = {
    formError: false,
    formSuccess: false,
    formdata: {
        name: {
            element: 'input',
            value: '',
            config: {
                name: 'name_input',
                type: 'text',
                placeholder: 'Enter your name'
            },
            validation: {
                required: true
            },
            valid: false,
            touched: false,
            validationMessage: ''
        },
        lastname: {
            element: 'input',
            value: '',
            config: {
                name: 'lastname_input',
                type: 'text',
                placeholder: 'Enter your lastname'
            },
            validation: {
                required: true
            },
            valid: false,
            touched: false,
            validationMessage: ''
        },
        email: {
            element: 'input',
            value: '',
            config: {
                name: 'email_input',
                type: 'email',
                placeholder: 'Enter your email'
            },
            validation: {
                required: true,
                email: true
            },
            valid: false,
            touched: false,
            validationMessage: ''
        },
        password: {
            element: 'input',
            value: '',
            config: {
                name: 'password_input',
                type: 'password',
                placeholder: 'Enter your password'
            },
            validation: {
                required: true
            },
            valid: false,
            touched: false,
            validationMessage: ''
        },
        confirmPassword: {
            element: 'input',
            value: '',
            config: {
                name: 'confirm_password_input',
                type: 'password',
                placeholder: 'Confirm your password'
            },
            validation: {
                required: true,
                confirm: 'password'
            },
            valid: false,
            touched: false,
            validationMessage: ''
        }
    }
}

updateForm = (element) => {
    const newFormdata = update(element, this.state.formdata, 'register');
    this.setState({
        formError: false,
        formdata: newFormdata
    })
}

submitForm = (event) => {
    event.preventDefault();

    let dataToSubmit = generateData(this.state.formdata, 'register');
    let formIsValid = isFormValid(this.state.formdata, 'register');

    if(formIsValid) {
        this.props.dispatch(registerUser(dataToSubmit))
            .then(response => {
                if(response.payload.success) {
                    this.setState({
                        formError: false,
                        formSuccess: true
                    });
                    setTimeout(() => {
                        this.props.history.push('/register_login');
                    }, 3000)

                } else {
                    this.setState({ formError: true });
                }
            }).catch(e => {
                this.setState({ formError: true });
            });
    } else {
        this.setState({
            formError: true
        });
    }
}

render() {
        return (
        <div className="page_wrapper">
            <div className="container">
                <div className="register_login_container">
                    <div className="left">
                        <form onSubmit={(event) => this.submitEvent(event)}>
                            <h2>Personal information</h2>
                                <div className="form_block_two">
                                    <div className="block">
                                        <FormField
                                            id={'name'}
                                            formdata={this.state.formdata.name}
                                            change={(element) => this.updateForm(element)}
                                        />
                                    </div>
                                    <div className="block">
                                        <FormField
                                            id={'lastname'}
                                            formdata={this.state.formdata.lastname}
                                            change={(element) => this.updateForm(element)}
                                        />
                                    </div>
                                </div>
                                <div>
                                    <FormField
                                        id={'email'}
                                        formdata={this.state.formdata.email}
                                        change={(element) => this.updateForm(element)}
                                    />
                                </div>
                                <h2>Verify password</h2>
                                <div className="form_block_two">
                                <div className="block">
                                    <FormField
                                        id={'password'}
                                        formdata={this.state.formdata.password}
                                        change={(element) => this.updateForm(element)}
                                    />
                                </div>
                                <div className="block">
                                    <FormField
                                        id={'confirmPassword'}
                                        formdata={this.state.formdata.confirmPassword}
                                        change={(element) => this.updateForm(element)}
                                    />
                                </div>
                            </div>
                            <div>
                                { this.state.formError ? 
                                    <div className="error_label">
                                        Please check your data
                                    </div>
                                :null}
                                <button onClick={(event) => this.submitForm(event)}>
                                    Create an account
                                </button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>

            <Dialog open={this.state.formSuccess}>
                <div className="dialog_alert">
                    <div>
                        Congratulations!
                    </div>
                    <div>
                        You will be redirected to the login in a couple of seconds...
                    </div>
                </div>
            </Dialog>

        </div>
    );
}
 }

 export default connect()(Register);

我希望我分享的内容对您有所帮助，如果没有帮助，我会为您提供尽可能多的信息来帮助我解决问题。提前致谢!

Answer 1

我重新安装了 Material UI 并重新启动了服务器，一切又恢复正常了。