ꯕꯨꯠꯁ꯭ꯠꯔꯥꯞ ꯑꯃꯁꯨꯡ ꯚꯤꯇꯦ꯫

ꯚꯤꯠ ꯁꯤꯖꯤꯟꯅꯗꯨꯅꯥ ꯅꯍꯥꯛꯀꯤ ꯄ꯭ꯔꯣꯖꯦꯛꯇꯇꯥ ꯕꯨꯠꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ. ꯑꯃꯁꯨꯡ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯑꯁꯤ ꯀꯔꯝꯅꯥ ꯌꯥꯑꯣꯍꯅꯒꯗꯒꯦ ꯑꯃꯁꯨꯡ ꯕꯟꯗꯜ ꯇꯧꯒꯗꯒꯦ ꯍꯥꯌꯕꯒꯤ ꯑꯣꯐꯤꯁꯤꯑꯦꯜ ꯒꯥꯏꯗꯂꯥꯏꯅꯁꯤꯡ꯫

ꯄꯦꯖ ꯑꯁꯤꯗꯥ ꯌꯥꯑꯣꯔꯤ꯫

ꯑꯔꯣꯏꯕꯥ ꯐꯥꯑꯣꯕꯥ ꯂꯥꯞꯅꯥ ꯆꯠꯄꯥ ꯄꯥꯝꯕꯤꯕꯔꯥ? ꯒꯥꯏꯗꯂꯥꯏꯟ ꯑꯁꯤꯒꯤꯗꯃꯛꯇꯥ ꯁꯣꯔꯁ ꯀꯣꯗ ꯑꯃꯁꯨꯡ ꯋꯥꯔꯀꯤꯡ ꯗꯦꯃꯣ ꯑꯁꯤ twbs/examples ꯔꯤꯄꯣꯖꯤꯇꯔꯤꯗꯒꯤ ꯗꯥꯎꯅꯂꯣꯗ ꯇꯧꯕꯤꯌꯨ . ꯂꯥꯏꯚ ꯑꯦꯗꯤꯇꯤꯡꯒꯤꯗꯃꯛ ꯅꯍꯥꯛꯅꯥ ꯈꯨꯗꯝ ꯑꯁꯤ StackBlitz ꯗꯥ ꯍꯥꯡꯗꯣꯀꯄꯁꯨ ꯌꯥꯏ꯫

ꯁꯦꯝꯒꯡꯄ

ꯑꯩꯈꯣꯌꯅꯥ ꯍꯧꯔꯀꯄꯗꯒꯤ ꯕꯨꯠꯁ꯭ꯠꯔꯥꯄꯀꯥ ꯂꯣꯌꯅꯅꯥ ꯚꯤꯇꯦ ꯄ꯭ꯔꯣꯖꯦꯛꯇ ꯑꯃꯥ ꯁꯦꯃꯒꯠꯂꯤ, ꯃꯔꯝ ꯑꯗꯨꯅꯥ ꯑꯩꯈꯣꯌꯅꯥ ꯇꯁꯦꯡꯅꯥ ꯍꯧꯗꯣꯛꯠꯔꯤꯉꯩꯒꯤ ꯃꯃꯥꯡꯗꯥ ꯃꯊꯧ ꯇꯥꯕꯥ ꯈꯔꯥ ꯑꯃꯁꯨꯡ ꯃꯃꯥꯡꯒꯤ ꯈꯣꯡꯊꯥꯡꯁꯤꯡ ꯂꯩꯔꯤ꯫ ꯒꯥꯏꯗꯂꯥꯏꯟ ꯑꯁꯤꯅꯥ ꯅꯍꯥꯀꯄꯨ Node.js ꯏꯅꯁ꯭ꯇꯣꯜ ꯇꯧꯕꯥ ꯑꯃꯁꯨꯡ ꯇꯔꯃꯤꯅꯦꯂꯒꯥ ꯃꯔꯤ ꯂꯩꯅꯕꯥ ꯈꯔꯥ ꯂꯩꯕꯥ ꯃꯊꯧ ꯇꯥꯏ꯫

ꯄ꯭ꯔꯣꯖꯦꯛꯇ ꯐꯣꯜꯗꯔ ꯑꯃꯥ ꯁꯦꯝꯃꯨ ꯑꯃꯁꯨꯡ npm ꯁꯦꯠ ꯇꯧ꯫ ꯑꯩꯈꯣꯌꯅꯥ my-projectꯐꯣꯜꯗꯔ ꯑꯗꯨ ꯁꯦꯃꯒꯅꯤ ꯑꯃꯁꯨꯡ -yꯃꯁꯤꯅꯥ ꯑꯩꯈꯣꯌꯗꯥ ꯏꯟꯇꯔꯦꯛꯇꯤꯕ ꯋꯥꯍꯪ ꯄꯨꯝꯅꯃꯛ ꯍꯪꯗꯅꯕꯥ ꯑꯥꯔꯒꯨꯃꯦꯟꯇ ꯑꯗꯨꯒꯥ ꯂꯣꯌꯅꯅꯥ npm ꯏꯅꯤꯁꯤꯑꯦꯂꯥꯏꯖ ꯇꯧꯒꯅꯤ꯫
```
mkdir my-project && cd my-project
npm init -y
```
ꯚꯤꯇꯦ ꯏꯅꯁ꯭ꯇꯣꯜ ꯇꯧꯕꯥ꯫ ꯑꯩꯈꯣꯌꯒꯤ ꯋꯦꯕꯄꯦꯛ ꯒꯥꯏꯗꯂꯥꯏꯅꯁꯤꯡꯒꯥ ꯃꯥꯟꯅꯗꯅꯥ, ꯃꯐꯝ ꯑꯁꯤꯗꯥ ꯕꯤꯜꯗ ꯇꯨꯜ ꯑꯃꯈꯛꯇꯃꯛ ꯗꯤꯄꯦꯟꯗꯦꯟꯁ ꯂꯩ꯫ ꯑꯩꯈꯣꯌꯅꯥ --save-devꯁꯤꯒꯅꯦꯜ ꯄꯤꯔꯤ ꯃꯗꯨꯗꯤ ꯃꯁꯤꯒꯤ ꯗꯤꯄꯦꯟꯗꯦꯟꯁ ꯑꯁꯤ ꯗꯤꯕꯦꯂꯄꯃꯦꯟꯇ ꯁꯤꯖꯤꯟꯅꯕꯒꯤꯗꯃꯛꯇꯗꯤ ꯈꯛꯇꯅꯤ ꯑꯃꯁꯨꯡ ꯄꯨꯊꯣꯀꯄꯒꯤꯗꯃꯛꯇꯅꯤ꯫
```
npm i --save-dev vite
```
ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯏꯅꯁ꯭ꯇꯣꯜ ꯇꯧ꯫ ꯍꯧꯖꯤꯛ ꯑꯩꯈꯣꯌꯅꯥ ꯕꯨꯠꯁ꯭ꯠꯔꯥꯞ ꯏꯅꯁ꯭ꯇꯣꯜ ꯇꯧꯕꯥ ꯌꯥꯔꯦ꯫ ꯑꯩꯈꯣꯌꯒꯤ ꯗ꯭ꯔꯣꯄꯗꯥꯎꯅꯁꯤꯡ, ꯄꯣꯄꯣꯚꯔꯁꯤꯡ, ꯑꯃꯁꯨꯡ ꯇꯨꯂꯇꯤꯄꯁꯤꯡ ꯑꯁꯤ ꯃꯈꯣꯌꯒꯤ ꯄꯣꯖꯤꯁꯅꯒꯤꯗꯃꯛꯇꯥ ꯃꯁꯤꯗꯥ ꯌꯨꯝꯐꯝ ꯑꯣꯏꯕꯅꯥ ꯑꯩꯈꯣꯌꯅꯥ ꯄꯣꯄꯔꯁꯨ ꯏꯅꯁ꯭ꯇꯣꯜ ꯇꯧꯒꯅꯤ꯫ ꯀꯔꯤꯒꯨꯝꯕꯥ ꯅꯍꯥꯛꯅꯥ ꯀꯝꯄꯣꯅꯦꯟꯇꯁꯤꯡ ꯑꯗꯨ ꯁꯤꯖꯤꯟꯅꯅꯕꯥ ꯊꯧꯔꯥꯡ ꯇꯧꯗ꯭ꯔꯕꯗꯤ, ꯅꯍꯥꯛꯅꯥ ꯃꯐꯃꯁꯤꯗꯥ ꯄꯣꯄꯔ ꯑꯁꯤ ꯂꯧꯊꯣꯀꯄꯥ ꯌꯥꯏ꯫
```
npm i --save bootstrap @popperjs/core
```
ꯑꯍꯦꯅꯕꯥ ꯗꯤꯄꯦꯟꯗꯦꯟꯁ ꯏꯅꯁ꯭ꯇꯣꯜ ꯇꯧꯕꯥ꯫ ꯚꯤꯠ ꯑꯃꯁꯨꯡ ꯕꯨꯠꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯃꯊꯛꯇꯥ, ꯑꯩꯈꯣꯌꯅꯥ ꯕꯨꯠꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.ꯕꯨ ꯃꯑꯣꯡ ꯆꯨꯝꯅꯥ ꯏꯝꯄꯣꯔꯠ ꯇꯧꯕꯥ ꯑꯃꯁꯨꯡ ꯕꯟꯗꯜ ꯇꯧꯅꯕꯥ ꯑꯇꯣꯞꯄꯥ ꯗꯤꯄꯦꯟꯗꯦꯟꯁ (ꯁꯥꯁ) ꯃꯊꯧ ꯇꯥꯏ꯫
```
npm i --save-dev sass
```

ꯍꯧꯖꯤꯛꯇꯤ ꯑꯩꯈꯣꯌꯅꯥ ꯃꯊꯧ ꯇꯥꯕꯥ ꯗꯤꯄꯦꯟꯗꯦꯟꯁ ꯄꯨꯝꯅꯃꯛ ꯏꯅꯁ꯭ꯇꯣꯜ ꯇꯧꯔꯦ ꯑꯃꯁꯨꯡ ꯁꯦꯇꯑꯞ ꯇꯧꯔꯦ, ꯑꯩꯈꯣꯌꯅꯥ ꯄ꯭ꯔꯣꯖꯦꯛꯇ ꯐꯥꯏꯂꯁꯤꯡ ꯁꯦꯝꯕꯥ ꯑꯃꯁꯨꯡ ꯕꯨꯠꯁ꯭ꯠꯔꯥꯞ ꯏꯝꯄꯣꯔꯠ ꯇꯧꯕꯒꯤ ꯊꯕꯛ ꯍꯧꯕꯥ ꯉꯝꯂꯦ꯫

ꯄ꯭ꯔꯣꯖꯦꯛꯇ ꯁ꯭ꯠꯔꯀꯆꯔ꯫

ꯑꯩꯈꯣꯌꯅꯥ ꯍꯥꯟꯅꯅꯥ my-projectꯐꯣꯜꯗꯔ ꯁꯦꯃꯈ꯭ꯔꯦ ꯑꯃꯁꯨꯡ npm ꯏꯅꯤꯁꯤꯑꯦꯂꯥꯏꯖ ꯇꯧꯈ꯭ꯔꯦ꯫ ꯍꯧꯖꯤꯛ ꯑꯩꯈꯣꯌꯅꯥ srcꯄ꯭ꯔꯣꯖꯦꯛꯇ ꯁ꯭ꯠꯔꯀꯆꯔ ꯑꯁꯤ ꯂꯥꯎꯊꯣꯛꯅꯕꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯐꯣꯜꯗꯔ, ꯁ꯭ꯇꯥꯏꯂꯁꯤꯠ, ꯑꯃꯁꯨꯡ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯐꯥꯏꯂꯁꯨ ꯁꯦꯃꯒꯅꯤ꯫ ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯥ ꯑꯁꯤ ꯗꯒꯤ ꯆꯠꯂꯨ my-project, ꯅꯠꯠꯔꯒꯥ ꯃꯈꯥꯗꯥ ꯎꯠꯂꯤꯕꯥ ꯐꯣꯜꯗꯔ ꯑꯃꯁꯨꯡ ꯐꯥꯏꯜ ꯁ꯭ꯠꯔꯀꯆꯔ ꯑꯗꯨ ꯃꯦꯅꯨꯑꯦꯜ ꯑꯣꯏꯅꯥ ꯁꯦꯝꯃꯨ꯫

mkdir {src,src/js,src/scss}
touch src/index.html src/js/main.js src/scss/styles.scss vite.config.js

ꯅꯍꯥꯛꯅꯥ ꯇꯧꯕꯥ ꯂꯣꯌꯔꯕꯥ ꯃꯇꯨꯡꯗꯥ, ꯅꯍꯥꯛꯀꯤ ꯃꯄꯨꯡꯐꯥꯕꯥ ꯄ꯭ꯔꯣꯖꯦꯛꯇ ꯑꯗꯨ ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯁꯤꯒꯨꯝꯅꯥ ꯑꯣꯏꯒꯗꯕꯅꯤ:

my-project/
├── src/
│   ├── js/
│   │   └── main.js
│   └── scss/
│   |   └── styles.scss
|   └── index.html
├── package-lock.json
├── package.json
└── vite.config.js

ꯃꯇꯝ ꯑꯁꯤꯗꯥ ꯄꯨꯝꯅꯃꯛ ꯑꯆꯨꯝꯕꯥ ꯃꯐꯃꯗꯥ ꯂꯩꯔꯤ, ꯑꯗꯨꯕꯨ ꯚꯤꯇꯦ ꯑꯁꯤ ꯊꯕꯛ ꯑꯣꯏꯅꯥ ꯄꯥꯡꯊꯣꯛꯂꯣꯏ ꯃꯔꯃꯗꯤ ꯑꯩꯈꯣꯌꯅꯥ ꯑꯩꯈꯣꯌꯒꯤ vite.config.jsꯍꯧꯖꯤꯛ ꯐꯥꯑꯣꯕꯥ ꯃꯄꯨꯡ ꯐꯥꯗ꯭ꯔꯤ꯫

ꯚꯤꯇꯦ ꯀꯅꯐꯤꯒꯔ ꯇꯧꯕꯥ꯫

ꯗꯤꯄꯦꯟꯗꯦꯟꯁꯁꯤꯡ ꯏꯅꯁ꯭ꯇꯣꯜ ꯇꯧꯔꯕꯥ ꯑꯃꯁꯨꯡ ꯑꯩꯈꯣꯌꯒꯤ ꯄ꯭ꯔꯣꯖꯦꯛꯇ ꯐꯣꯜꯗꯔ ꯑꯁꯤ ꯑꯩꯈꯣꯌꯅꯥ ꯀꯣꯗꯤꯡ ꯍꯧꯅꯕꯥ ꯁꯦꯝ ꯁꯥꯔꯕꯥ ꯃꯇꯨꯡꯗꯥ, ꯑꯩꯈꯣꯌꯅꯥ ꯍꯧꯖꯤꯛꯇꯤ ꯚꯤꯠ ꯀꯅꯐꯤꯒꯔ ꯇꯧꯕꯥ ꯌꯥꯔꯦ ꯑꯃꯁꯨꯡ ꯑꯩꯈꯣꯌꯒꯤ ꯄ꯭ꯔꯣꯖꯦꯛꯇ ꯑꯁꯤ ꯂꯣꯀꯦꯜ ꯑꯣꯏꯅꯥ ꯆꯠꯄꯥ ꯌꯥꯔꯦ꯫

vite.config.jsꯅꯍꯥꯛꯀꯤ ꯑꯦꯗꯤꯇꯔꯗꯥ ꯍꯥꯡꯗꯣꯀꯎ꯫ ꯃꯁꯤ ꯕ꯭ꯂꯦꯉ꯭ꯛ ꯑꯣꯏꯕꯅꯥ, ꯑꯩꯈꯣꯌꯅꯥ ꯃꯁꯤꯗꯥ ꯕꯣꯏꯂꯔꯞꯂꯦꯠ ꯀꯅꯐꯤꯒ ꯈꯔꯥ ꯍꯥꯄꯆꯤꯅꯕꯥ ꯃꯊꯧ ꯇꯥꯒꯅꯤ ꯃꯔꯝ ꯑꯗꯨꯅꯥ ꯑꯩꯈꯣꯌꯅꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯁꯔꯚꯔ ꯍꯧꯕꯥ ꯌꯥꯒꯅꯤ꯫ ꯀꯅꯐꯤꯒꯀꯤ ꯁꯔꯨꯛ ꯑꯁꯤꯅꯥ ꯚꯤꯇꯦꯗꯥ ꯍꯥꯌꯔꯤ ꯃꯗꯨꯗꯤ ꯑꯩꯈꯣꯌꯒꯤ ꯄ꯭ꯔꯣꯖꯦꯛꯇꯀꯤ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯑꯃꯁꯨꯡ ꯗꯤꯕꯦꯂꯄꯃꯦꯟꯇ ꯁꯔꯚꯔꯅꯥ ꯀꯔꯝꯅꯥ ꯂꯃꯆꯠ ꯁꯥꯖꯠ ꯆꯠꯀꯗꯒꯦ ꯍꯥꯌꯕꯗꯨ ꯌꯦꯡꯒꯗꯕꯅꯤ ( srcꯍꯣꯠ ꯔꯤꯂꯣꯗ ꯇꯧꯔꯕꯥ ꯐꯣꯜꯗꯔꯗꯒꯤ ꯄꯨꯊꯣꯀꯄꯥ)꯫
```
const path = require('path')

export default {
  root: path.resolve(__dirname, 'src'),
  server: {
    port: 8080,
    hot: true
  }
}
```
ꯃꯊꯪꯗꯥ ꯑꯩꯈꯣꯌꯅꯥ ꯃꯄꯨꯡ ꯐꯥꯍꯜꯂꯤ src/index.html. ꯃꯁꯤ HTML ꯄꯦꯖꯅꯤ Vite ꯅꯥ ꯕ꯭ꯔꯥꯎꯖꯔꯗꯥ ꯂꯣꯗ ꯇꯧꯒꯅꯤ ꯃꯗꯨꯅꯥ ꯕꯟꯗꯜ ꯇꯧꯔꯕꯥ CSS ꯑꯃꯁꯨꯡ JS ꯁꯤꯖꯤꯟꯅꯅꯕꯥ ꯑꯩꯈꯣꯌꯅꯥ ꯇꯨꯡꯗꯥ ꯈꯣꯡꯊꯥꯡꯁꯤꯡꯗꯥ ꯍꯥꯄꯆꯤꯜꯂꯒꯅꯤ꯫
```
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Bootstrap w/ Vite</title>
  </head>
  <body>
    <div class="container py-4 px-3 mx-auto">
      <h1>Hello, Bootstrap and Vite!</h1>
      <button class="btn btn-primary">Primary button</button>
    </div>
    <script type="module" src="./js/main.js"></script>
  </body>
</html>
```
ꯑꯩꯈꯣꯌꯅꯥ ꯃꯐꯝ ꯑꯁꯤꯗꯥ ꯕꯨꯠꯁ꯭ꯠꯔꯥꯞ ꯁ꯭ꯇꯥꯏꯂꯤꯡ ꯈꯔꯥ ꯌꯥꯑꯣꯔꯤ div class="container"ꯑꯃꯁꯨꯡ <button>ꯃꯁꯤꯅꯥ ꯑꯩꯈꯣꯌꯅꯥ ꯕꯨꯠꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ.ꯅꯥ ꯚꯤꯇꯦꯅꯥ ꯂꯣꯗ ꯇꯧꯕꯥ ꯃꯇꯃꯗꯥ ꯎꯕꯥ ꯐꯪꯒꯅꯤ꯫
ꯍꯧꯖꯤꯛ ꯑꯩꯈꯣꯌꯅꯥ ꯚꯤꯇꯦ ꯆꯠꯅꯕꯥ npm ꯁ꯭ꯛꯔꯤꯞꯇ ꯑꯃꯥ ꯃꯊꯧ ꯇꯥꯏ꯫ ꯃꯈꯥꯗꯥ ꯎꯠꯂꯤꯕꯥ ꯁ꯭ꯛꯔꯤꯞꯇ ꯑꯗꯨ ꯍꯥꯡꯗꯣꯀꯎ package.jsonꯑꯃꯁꯨꯡ ꯍꯥꯄꯆꯤꯜꯂꯨ start(ꯅꯍꯥꯛꯅꯥ ꯍꯥꯟꯅꯅꯥ ꯇꯦꯁ꯭ꯠ ꯁ꯭ꯛꯔꯤꯞꯇ ꯑꯗꯨ ꯂꯩꯒꯗꯕꯅꯤ)꯫ ꯑꯩꯈꯣꯌꯅꯥ ꯁ꯭ꯛꯔꯤꯞꯇ ꯑꯁꯤ ꯑꯩꯈꯣꯌꯒꯤ ꯂꯣꯀꯦꯜ ꯚꯤꯇꯦ ꯗꯦꯚ ꯁꯔꯚꯔ ꯍꯧꯗꯣꯛꯅꯕꯥ ꯁꯤꯖꯤꯟꯅꯒꯅꯤ꯫
```
{
  // ...
  "scripts": {
    "start": "vite",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  // ...
}
```
ꯑꯃꯁꯨꯡ ꯑꯔꯣꯏꯕꯗꯥ ꯑꯩꯈꯣꯌꯅꯥ ꯚꯤꯇꯦ ꯍꯧꯕꯥ ꯌꯥꯏ꯫ ꯅꯍꯥꯛꯀꯤ ꯇꯔꯃꯤꯅꯦꯂꯗꯥ ꯂꯩꯕꯥ ꯐꯣꯜꯗꯔ ꯑꯗꯨꯗꯒꯤ my-project, ꯅꯧꯅꯥ ꯍꯥꯄꯆꯤꯜꯂꯕꯥ npm ꯁ꯭ꯛꯔꯤꯞꯇ ꯑꯗꯨ ꯔꯟ ꯇꯧ:
```
npm start
```

ꯒꯥꯏꯗꯂꯥꯏꯟ ꯑꯁꯤꯒꯤ ꯃꯊꯪꯒꯤ ꯑꯃꯁꯨꯡ ꯑꯔꯣꯏꯕꯥ ꯁꯦꯛꯁꯟ ꯑꯁꯤꯗꯥ, ꯑꯩꯈꯣꯌꯅꯥ ꯕꯨꯇꯁ꯭ꯠꯔꯥꯄꯀꯤ CSS ꯑꯃꯁꯨꯡ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯄꯨꯝꯅꯃꯛ ꯏꯝꯄꯣꯔꯠ ꯇꯧꯒꯅꯤ꯫

ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯏꯝꯄꯣꯔꯠ ꯇꯧꯕꯥ꯫

ꯕꯨꯇꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯁꯥꯁ ꯏꯝꯄꯣꯔꯠ ꯑꯁꯤ vite.config.js. ꯅꯍꯥꯛꯀꯤ ꯀꯅꯐꯤꯒꯔꯦꯁꯟ ꯐꯥꯏꯜ ꯑꯗꯨ ꯍꯧꯖꯤꯛ ꯃꯄꯨꯡ ꯐꯥꯔꯦ ꯑꯃꯁꯨꯡ ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯥ ꯁ꯭ꯅꯤꯄꯦꯠ ꯑꯁꯤꯒꯥ ꯃꯥꯟꯅꯒꯗꯕꯅꯤ꯫ ꯃꯐꯝ ꯑꯁꯤꯗꯥ ꯂꯩꯔꯤꯕꯥ ꯑꯃꯠꯇꯥ ꯉꯥꯏꯔꯕꯥ ꯑꯅꯧꯕꯥ ꯁꯔꯨꯛ ꯑꯁꯤ ꯁꯦꯛꯁꯟ ꯑꯁꯤꯅꯤ—ꯑꯩꯈꯣꯌꯅꯥ ꯃꯁꯤ ꯁꯤꯖꯤꯟꯅꯗꯨꯅꯥ ꯏꯝꯄꯣꯔꯠ ꯇꯧꯕꯥ ꯌꯥꯔꯤꯕꯃꯈꯩ ꯂꯥꯏꯅꯥ ꯊꯝꯅꯕꯥ resolveꯃꯅꯨꯡꯗꯥ ꯂꯩꯔꯤꯕꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯁꯣꯔꯁ ꯐꯥꯏꯂꯁꯤꯡꯗꯥ ꯑꯦꯂꯤꯌꯥꯁ ꯑꯃꯥ ꯍꯥꯄꯆꯤꯟꯅꯕꯥ ꯁꯤꯖꯤꯟꯅꯩ꯫node_modules
```
const path = require('path')

export default {
  root: path.resolve(__dirname, 'src'),
  resolve: {
    alias: {
      '~bootstrap': path.resolve(__dirname, 'node_modules/bootstrap'),
    }
  },
  server: {
    port: 8080,
    hot: true
  }
}
```
ꯍꯧꯖꯤꯛ, ꯕꯨꯠꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ. src/scss/styles.scssꯕꯨꯠꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯁꯣꯔꯁ ꯁꯥꯁ ꯄꯨꯝꯅꯃꯛ ꯏꯝꯄꯣꯔꯠ ꯇꯧꯅꯕꯥ ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯥ ꯑꯁꯤ ꯍꯥꯄꯆꯤꯜꯂꯨ꯫
```
// Import all of Bootstrap's CSS
@import "~bootstrap/scss/bootstrap";
```
ꯀꯔꯤꯒꯨꯝꯕꯥ ꯅꯍꯥꯛꯅꯥ ꯄꯥꯝꯂꯕꯗꯤ ꯑꯩꯈꯣꯌꯒꯤ ꯁ꯭ꯇꯥꯏꯂꯁꯤꯠꯁꯤꯡ ꯑꯁꯤ ꯑꯃꯃꯃꯒꯤ ꯑꯣꯏꯅꯥ ꯏꯝꯄꯣꯔꯠ ꯇꯧꯕꯁꯨ ꯌꯥꯒꯅꯤ꯫ ꯑꯀꯨꯞꯄꯥ ꯃꯔꯣꯂꯒꯤꯗꯃꯛ ꯑꯩꯈꯣꯌꯒꯤ ꯁꯥꯁ ꯏꯝꯄꯣꯔꯠ ꯗꯣꯀꯁꯤꯡ ꯄꯥꯕꯤꯌꯨ꯫
ꯃꯊꯪꯗꯥ ꯑꯩꯈꯣꯌꯅꯥ CSS ꯂꯣꯗ ꯇꯧꯏ ꯑꯃꯁꯨꯡ ꯕꯨꯇꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯏꯝꯄꯣꯔꯠ ꯇꯧꯏ꯫ src/js/main.jsCSS ꯂꯣꯗ ꯇꯧꯅꯕꯥ ꯑꯃꯁꯨꯡ ꯕꯨꯇꯁ꯭ꯠꯔꯥꯄꯀꯤ JS ꯄꯨꯝꯅꯃꯛ ꯏꯝꯄꯣꯔꯠ ꯇꯧꯅꯕꯥ ꯃꯈꯥꯗꯥ ꯄꯤꯔꯤꯕꯥ ꯑꯁꯤ ꯍꯥꯄꯆꯤꯜꯂꯨ꯫ ꯄꯣꯄꯔ ꯑꯁꯤ ꯕꯨꯠꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯈꯨꯠꯊꯥꯡꯗꯥ ꯑꯣꯇꯣꯃꯦꯇꯤꯛ ꯑꯣꯏꯅꯥ ꯏꯝꯄꯣꯔꯠ ꯇꯧꯒꯅꯤ꯫
```
// Import our custom CSS
import '../scss/styles.scss'

// Import all of Bootstrap's JS
import * as bootstrap from 'bootstrap'
```
ꯕꯟꯗꯜ ꯁꯥꯏꯖꯁꯤꯡ ꯍꯟꯊꯍꯟꯅꯕꯥ ꯃꯊꯧ ꯇꯥꯕꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯅꯍꯥꯛꯅꯥ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯄ꯭ꯂꯒꯏꯅꯁꯤꯡ ꯑꯃꯃꯝ ꯑꯣꯏꯅꯥ ꯏꯝꯄꯣꯔꯠ ꯇꯧꯕꯁꯨ ꯌꯥꯏ:
```
import Alert from 'bootstrap/js/dist/alert';

// or, specify which plugins you need:
import { Tooltip, Toast, Popover } from 'bootstrap';
```
ꯕꯨꯇꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯄ꯭ꯂꯒꯏꯅꯁꯤꯡ ꯀꯔꯝꯅꯥ ꯁꯤꯖꯤꯟꯅꯒꯗꯒꯦ ꯍꯥꯌꯕꯒꯤ ꯃꯇꯥꯡꯗꯥ ꯑꯍꯦꯅꯕꯥ ꯏꯅꯐꯣꯔꯃꯦꯁꯅꯒꯤꯗꯃꯛꯇꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯗꯣꯛꯌꯨꯃꯦꯟꯇꯁꯤꯡ ꯄꯥꯕꯤꯌꯨ꯫
ꯑꯃꯁꯨꯡ ꯅꯈꯣꯌꯅꯥ ꯇꯧꯔꯦ! 🎉 ꯕꯨꯇꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯁꯣꯔꯁ ꯁꯥꯁ ꯑꯃꯁꯨꯡ ꯖꯦ.ꯑꯦꯁ.ꯅꯥ ꯃꯄꯨꯡ ꯐꯥꯅꯥ ꯂꯣꯗ ꯇꯧꯔꯕꯥ ꯃꯇꯨꯡꯗꯥ, ꯅꯍꯥꯛꯀꯤ ꯂꯣꯀꯦꯜ ꯗꯤꯚꯦꯂꯄꯃꯦꯟꯇ ꯁꯔꯚꯔ ꯑꯗꯨ ꯍꯧꯖꯤꯛ ꯑꯁꯤꯒꯨꯝꯅꯥ ꯑꯣꯏꯒꯗꯕꯅꯤ꯫

ꯍꯧꯖꯤꯛꯇꯤ ꯅꯍꯥꯛꯅꯥ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯄꯥꯝꯂꯤꯕꯥ Bootstrap ꯀꯝꯄꯣꯅꯦꯟꯇ ꯑꯃꯍꯦꯛꯇꯕꯨ ꯍꯥꯄꯆꯤꯅꯕꯥ ꯍꯧꯕꯥ ꯌꯥꯔꯦ꯫ ꯑꯍꯦꯅꯕꯥ ꯀꯁ꯭ꯇꯝ ꯁꯥꯁ ꯑꯁꯤ ꯀꯔꯝꯅꯥ ꯌꯥꯑꯣꯍꯅꯒꯅꯤ ꯑꯃꯁꯨꯡ ꯅꯍꯥꯛꯅꯥ ꯃꯊꯧ ꯇꯥꯔꯤꯕꯥ ꯕꯨꯠꯁ꯭ꯠꯔꯥꯄꯀꯤ CSS ꯑꯃꯁꯨꯡ JSꯒꯤ ꯁꯔꯨꯛ ꯈꯛꯇꯃꯛ ꯏꯝꯄꯣꯔꯠ ꯇꯧꯗꯨꯅꯥ ꯅꯍꯥꯛꯀꯤ ꯕꯤꯜꯗ ꯑꯗꯨ ꯑꯣꯞꯇꯤꯃꯥꯏꯖ ꯇꯧꯒꯅꯤ ꯍꯥꯌꯕꯒꯤ ꯃꯄꯨꯡ ꯐꯥꯕꯥ Vite ꯈꯨꯗꯝ ꯄ꯭ꯔꯣꯖꯦꯛꯇ ꯑꯗꯨ ꯁꯣꯌꯗꯅꯥ ꯆꯦꯛ ꯇꯧꯕꯤꯌꯨ꯫

ꯃꯐꯝ ꯑꯁꯤꯗꯥ ꯑꯔꯥꯅꯕꯥ ꯅꯠꯔꯒꯥ ꯃꯇꯝ ꯂꯣꯏꯔꯕꯥ ꯋꯥꯐꯝ ꯑꯃꯥ ꯎꯕꯥ ꯐꯪꯂꯤꯕꯔꯥ? ꯆꯥꯅꯕꯤꯗꯨꯅꯥ GitHub ꯗꯥ ꯏꯁꯨ ꯑꯃꯥ ꯍꯥꯡꯗꯣꯀꯄꯤꯌꯨ . ꯇ꯭ꯔꯕꯂꯁꯨꯠ ꯇꯧꯕꯗꯥ ꯃꯇꯦꯡ ꯃꯊꯧ ꯇꯥꯕ꯭ꯔꯥ? GitHub ꯗꯥ ꯁꯥꯔꯆ ꯇꯧꯕꯥ ꯅꯠꯠꯔꯒꯥ ꯈꯟꯅ-ꯅꯩꯅꯕꯥ ꯑꯃꯥ ꯍꯧꯕꯥ꯫