以下命令均在git管理员方式运行下执行
Laravel 项目中使用 Bootstrap 前端框架,需要先执行以下命令: $ composer require laravel/ui --dev
上面的命令安装完成后,使用以下命令来引入 Bootstrap : $ php artisan ui bootstrap
更改引导文件package.json 建议直接导入以下内容,防止后续报错: { "private": true, "scripts": { "dev": "npm run development", "development": "NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js", "watch": "npm run development -- --watch", "watch-poll": "npm run watch -- --watch-poll", "hot": "NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js", "prod": "npm run production", "production": "NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js" }, "devDependencies": { "axios": "^0.19", "bootstrap": "^4.0.0", "cross-env": "^5.1", "jquery": "^3.2", "laravel-mix": "^4.0.7", "lodash": "^4.17.13", "popper.js": "^1.12", "resolve-url-loader": "^2.3.1", "sass": "^1.15.2", "sass-loader": "^7.1.0", "vue-template-compiler": "^2.6.10" } }
Yarn 对扩展包进行安装 $ yarn install --no-bin-links $ yarn add cross-env //此处会出现一个报错问题不用管,在Linux环境中没有用,有的写不需要此步骤。
修改resources/sass/app.scss为 // Bootstrap @import '~bootstrap/scss/bootstrap';
$ npm run dev 将 .scss 文件编译为 .css $ npm run watch-poll 在每次检测到 .scss 文件发生更改时,自动将其编译为 .css 文件 |