Changing version of bootstrap from 4 to 3

In the latest installation of Laravel it comes with Boostrap 4. But I do not want to use Bootstrap 4. In my Laravel project I changed the package.json as follows:

"devDependencies": {
        "axios": "^0.18",
        "bootstrap-sass": "^3.3.7",
        "popper.js": "^1.12",
        "cross-env": "^5.1",
        "jquery": "^3.2",
        "laravel-mix": "^2.0",
        "lodash": "^4.17.4",
        "vue": "^2.5.7"
}

And then I run "npm install". No when I run "npm run dev", i get lots of error like:

> @ development C:\LarProjects\larOne
> cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js

 95% emitting

 ERROR  Failed to compile with 3 errors                                                                                             23:10:44
 error  in ./resources/assets/sass/app.scss

Module build failed:
undefined
^
      File to import not found or unreadable: ~bootstrap/scss/bootstrap.
      in C:\LarProjects\larOne\resources\assets\sass\app.scss (line 9, column 1)

 @ ./resources/assets/sass/app.scss 4:14-266
 @ multi ./resources/assets/js/app.js ./resources/assets/sass/app.scss

 error  in ./resources/assets/sass/app.scss

Module build failed: ModuleBuildError: Module build failed:
undefined
^
      File to import not found or unreadable: ~bootstrap/scss/bootstrap.
      in C:\LarProjects\larOne\resources\assets\sass\app.scss (line 9, column 1)
    at runLoaders (C:\LarProjects\larOne\node_modules\webpack\lib\NormalModule.js:195:19)
    at C:\LarProjects\larOne\node_modules\loader-runner\lib\LoaderRunner.js:364:11
    at C:\LarProjects\larOne\node_modules\loader-runner\lib\LoaderRunner.js:230:18
    at context.callback (C:\LarProjects\larOne\node_modules\loader-runner\lib\LoaderRunner.js:111:13)
    at Object.asyncSassJobQueue.push [as callback] (C:\LarProjects\larOne\node_modules\sass-loader\lib\loader.js:55:13)
    at Object.done [as callback] (C:\LarProjects\larOne\node_modules\neo-async\async.js:7974:18)
    at options.error (C:\LarProjects\larOne\node_modules\node-sass\lib\index.js:294:32)

 error  in ./resources/assets/sass/app.scss

Module build failed: ModuleBuildError: Module build failed:
undefined
^
      File to import not found or unreadable: ~bootstrap/scss/bootstrap.
      in C:\LarProjects\larOne\resources\assets\sass\app.scss (line 9, column 1)
    at runLoaders (C:\LarProjects\larOne\node_modules\webpack\lib\NormalModule.js:195:19)
    at C:\LarProjects\larOne\node_modules\loader-runner\lib\LoaderRunner.js:364:11
    at C:\LarProjects\larOne\node_modules\loader-runner\lib\LoaderRunner.js:230:18
    at context.callback (C:\LarProjects\larOne\node_modules\loader-runner\lib\LoaderRunner.js:111:13)
    at Object.asyncSassJobQueue.push [as callback] (C:\LarProjects\larOne\node_modules\sass-loader\lib\loader.js:55:13)
    at Object.done [as callback] (C:\LarProjects\larOne\node_modules\neo-async\async.js:7974:18)
    at options.error (C:\LarProjects\larOne\node_modules\node-sass\lib\index.js:294:32)
                                                                                                                                    Asset
  Size  Chunks                    Chunk Names
/js/app.js  1.25 MB       0  [emitted]  [big]  /js/app

WARNING in ./resources/assets/js/bootstrap.js
Module not found: Error: Can't resolve 'bootstrap' in 'C:\LarProjects\larOne\resources\assets\js'
 @ ./resources/assets/js/bootstrap.js 14:2-22
 @ ./resources/assets/js/app.js
 @ multi ./resources/assets/js/app.js ./resources/assets/sass/app.scss

ERROR in ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/lib??postcss!./node_modules/resolve-url-loader??ref--5-4!./node_modules/sass-loader/lib/loader.js??ref--5-5!./resources/assets/sass/app.scss
Module build failed:
undefined
^
      File to import not found or unreadable: ~bootstrap/scss/bootstrap.
      in C:\LarProjects\larOne\resources\assets\sass\app.scss (line 9, column 1)
 @ ./resources/assets/sass/app.scss 4:14-266
 @ multi ./resources/assets/js/app.js ./resources/assets/sass/app.scss

ERROR in ./resources/assets/sass/app.scss
Module build failed: ModuleBuildError: Module build failed:
undefined
^
      File to import not found or unreadable: ~bootstrap/scss/bootstrap.
      in C:\LarProjects\larOne\resources\assets\sass\app.scss (line 9, column 1)
    at runLoaders (C:\LarProjects\larOne\node_modules\webpack\lib\NormalModule.js:195:19)
    at C:\LarProjects\larOne\node_modules\loader-runner\lib\LoaderRunner.js:364:11
    at C:\LarProjects\larOne\node_modules\loader-runner\lib\LoaderRunner.js:230:18
    at context.callback (C:\LarProjects\larOne\node_modules\loader-runner\lib\LoaderRunner.js:111:13)
    at Object.asyncSassJobQueue.push [as callback] (C:\LarProjects\larOne\node_modules\sass-loader\lib\loader.js:55:13)
    at Object.done [as callback] (C:\LarProjects\larOne\node_modules\neo-async\async.js:7974:18)
    at options.error (C:\LarProjects\larOne\node_modules\node-sass\lib\index.js:294:32)
 @ ./resources/assets/sass/app.scss
 @ multi ./resources/assets/js/app.js ./resources/assets/sass/app.scss

ERROR in ./resources/assets/sass/app.scss
Module build failed: ModuleBuildError: Module build failed:
undefined
^
      File to import not found or unreadable: ~bootstrap/scss/bootstrap.
      in C:\LarProjects\larOne\resources\assets\sass\app.scss (line 9, column 1)
    at runLoaders (C:\LarProjects\larOne\node_modules\webpack\lib\NormalModule.js:195:19)
    at C:\LarProjects\larOne\node_modules\loader-runner\lib\LoaderRunner.js:364:11
    at C:\LarProjects\larOne\node_modules\loader-runner\lib\LoaderRunner.js:230:18
    at context.callback (C:\LarProjects\larOne\node_modules\loader-runner\lib\LoaderRunner.js:111:13)
    at Object.asyncSassJobQueue.push [as callback] (C:\LarProjects\larOne\node_modules\sass-loader\lib\loader.js:55:13)
    at Object.done [as callback] (C:\LarProjects\larOne\node_modules\neo-async\async.js:7974:18)
    at options.error (C:\LarProjects\larOne\node_modules\node-sass\lib\index.js:294:32)
 @ ./resources/assets/sass/app.scss
 @ multi ./resources/assets/js/app.js ./resources/assets/sass/app.scss
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! @ development: `cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the @ development script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\hp\AppData\Roaming\npm-cache\_logs\2018-06-30T20_10_44_115Z-debug.log
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! @ dev: `npm run development`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the @ dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\hp\AppData\Roaming\npm-cache\_logs\2018-06-30T20_10_44_144Z-debug.log

I thought that this may be wrong way that i am doing. I actually think that we should have a way to select the version of bootstrap while creating laravel project with composer.

from Newest questions tagged laravel-5 - Stack Overflow https://ift.tt/2Kyf0UZ
via IFTTT