Click the accordions below to expand/collapse the accordion content.
To render an accordion that’s expanded by default:
+
- add the `.show` class on the `.accordion-collapse` element.
- drop the `.collapsed` class from the `.accordion-button` element and set its `aria-expanded` attribute to `true`.
Inline code is available with the `<code>` element. Snippets of multiple lines of code are supported through Rouge. Longer lines will automatically scroll horizontally when needed. You may also use code fencing (triple backticks) for rendering code.
-```
+```js
// Example can be run directly in your JavaScript console
// Create a function that takes two arguments and returns the sum of those arguments
*You can also import our stylesheets individually if you want. [Read our Sass import docs]([[docsref:/customize/sass#importing]]) for details.*
-3. **Next we load the CSS and import Bootstrap’s JavaScript.** Add the following to `src/js/main.js` to load the CSS and import all of Bootstrap’s JS. Popper will be imported automatically through Bootstrap.
+2. **Next we load the CSS and import Bootstrap’s JavaScript.** Add the following to `src/js/main.js` to load the CSS and import all of Bootstrap’s JS. Popper will be imported automatically through Bootstrap.
```js
// Import our custom CSS
*[Read our JavaScript docs]([[docsref:/getting-started/javascript/]]) for more information on how to use Bootstrap’s plugins.*
-4. **And you’re done! 🎉** With Bootstrap’s source Sass and JS fully loaded, your local development server should now look like this:
+3. **And you’re done! 🎉** With Bootstrap’s source Sass and JS fully loaded, your local development server should now look like this:
<img class="img-fluid" src="/docs/[[config:docs_version]]/assets/img/guides/vite-dev-server-bootstrap.png" alt="Vite dev server running with Bootstrap" />