pil*_*eup 3 css sass twitter-bootstrap laravel vite
我遵循以下指南：
https://getbootstrap.com/docs/5.2/getting-started/vite/
我仍然遇到各种错误，有时找不到文件，有时我只是看不到引导程序设计。
我使用 npm 安装了 Bootstrap：
npm install bootstrap@5.2.2
然后我使用 npm 安装了 scss：
npm i --save-dev sass
然后我将以下内容添加到vite.config.js：
resolve: {
alias: {
'~bootstrap': path.resolve(__dirname, 'nodes_modules/bootstrap'),
}
}
还添加了以下内容/resources/app.js：
import '/resources/scss/styles.scss'
import * as bootstrap from 'bootstrap';
我还创建了一个新scss文件夹/resources，并将以下styles.scss文件放入其中：
// Import all of Bootstrap's CSS
@import "~bootstrap/scss/bootstrap";
但是当我使用npm run devor时build，Bootstrap 样式不会显示，或者我收到有关文件不存在的错误，例如：
[plugin:vite:css] [sass] ENOENT: no such file or directory, open '/var/www/myapp/nodes_modules/bootstrap/scss/bootstrap
小智 8
使用 Vite 在 Laravel 9 中安装 Bootstrap 5
npm i bootstrap sass @popperjs/core --save-dev
import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
export default defineConfig({
plugins: [
laravel({
input: ['resources/css/app.scss', 'resources/js/app.js'],
refresh: true,
}),
],
});
在 resources/css/app.scss 文件中添加以下代码行导入 Bootstrap
@import 'bootstrap/scss/bootstrap';
在文件 resources/js/bootstrap.js 中添加以下行
...
import * as Popper from '@popperjs/core'
window.Popper = Popper
import 'bootstrap'
...
在 resources/views/welcome.blade.php 文件中，将以下代码粘贴到结束标记之前：
...
@vite(['resources/js/app.js', 'resources/css/app.scss'])
</head>
<body>
...
npm run dev