CODEWITHSUNDEEP
node.jsreactjsnpmreact-bootstrap
Giwoo Gustavo Lee
Giwoo Gustavo Lee

Reputation: 344

Module not found: Error: Can't resolve 'react-bootstrap-validation'

Issue

I keep getting the following error in webpack

Error: Cannot find module 'react-bootstrap-validtion'
    at Function.Module._resolveFilename (module.js:339:15)
    at Function.Module._load (module.js:290:25)
    at Module.require (module.js:367:17)
    at require (internal/module.js:20:19)

Have I referenced or installed the module incorrectly?

This is how I've done it following the example in the official website. (https://www.npmjs.com/package/react-bootstrap-validation)

Environment

This are the node environment I'm working with

npm -v
3.10.7

nvm version
v5.11.1

node -v
v5.11.1

This is how I've installed the module

npm install --save react-bootstrap-validation

React Component

This is how I've implemented my React component

import React, {Component} from 'react'
import { ButtonInput } from 'react-bootstrap'
import { Form } from 'react-bootstrap-validation'

export default class LoginForm extends Component {

  constructor(props) {
    super(props)
    this.state = {
      showModal: false,
      email: '',
      password: ''
    }
  }

  _handleValidSubmit(values) {}
  _handleInvalidSubmit(errors, values) {}

  render() {
    return (
      <div>
        <div className="account">
          <div className="container">
            <div className="page-title">Login</div>
            <div className="page-desc">Email used at sign up</div>
            <Form
              onValidSubmit={this._handleValidSubmit.bind(this)}
              onInvalidSubmit={this._handleInvalidSubmit.bind(this)}>
              <ValidatedInput
                type="text"
                label="Email"
                name="email"
                validate="required,isEmail"
                errorHelp={{
                  required: "Please enter your e-mail",
                  isEmail: "Email is invalid"
                }}
              />

              <ValidatedInput
                type="password"
                label="Password"
                name="password"
                validate="required,isLength:6:60"
                errorHelp={{
                  required: "Please specify a password",
                  isEmail: "Password must be at least 6 characters"
                }}
              />

              <ButtonInput
                type="submit"
                bsSize="large"
                bsStyle="primary"
                value="LOGIN"
              />
            </Form>
          </div>
        </div>
      </div>
    )
  }
}

Upvotes: 18

Views: 180700

Answers (5)

Taher Salah
Taher Salah

Reputation: 407

Open your terminal in your project's root directory (where your package.json file is located) and run the following commands:

with NPM

npm install react-bootstrap bootstrap

ONLY If you use TypeScript

npm install --save-dev @types/react-bootstrap @types/bootstrap

And you should import bootstrap in index.css or app.css

@import '/node_modules/bootstrap/dist/css/bootstrap.min.css';

Upvotes: 0

Awara Amini
Awara Amini

Reputation: 572

This sorted my issue

npm install --save react-bootstrap-validation

Upvotes: 0

matt
matt

Reputation: 2429

If the accepted answer doesn't work for you, it could be that your version of bootstrap-react is newer than the version of whatever you're trying to implement/emulate.

For me, I checked the package.json file of the tutorial I was looking at and found:

"react-bootstrap": "^1.5.2",

You can also just run npm list in the project if you have it downloaded on your machine.

But when I ran npm list on my own project I got

[email protected]

So I ran

npm install [email protected]

and resolved the issue.

Upvotes: 0

Parveen yadav
Parveen yadav

Reputation: 2362

Module not found error occurs when you are using some module and that module is not installed or node is unable to locate that module due to wrong path.

One module you are trying to install have either dependency on other modules as well

so sometime not all the modules are installed correctly due to some permission security issues.

So please try with giving all permission or run as Root and add sudo if you are using ubuntu machine.

So you can install that module via directly running the following command:-

npm install react-bootstrap-validation --save

or if you are using linux/ubuntu than run following command:-

sudo npm install react-bootstrap-validation --save

Or first please check in the console when installing the module that

is there any dependency error showing in the console

if so then please also attach that console, on that case you need to install dependent module also as separately via npm install.

Hope this will help!

Thanks

Upvotes: 29

pranavi reddy
pranavi reddy

Reputation: 41

You can try to use this:

npm i --save react-bootstrap

Upvotes: 4

Related Questions