ꯋꯦꯕꯄꯦꯛ ꯑꯃꯁꯨꯡ ꯕꯟꯗꯂꯔꯁꯤꯡ꯫

ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯏꯅꯁ꯭ꯇꯣꯜ ꯇꯧꯕꯥ꯫

npm ꯁꯤꯖꯤꯟꯅꯗꯨꯅꯥ ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯑꯁꯤ Node.js ꯃꯣꯗ꯭ꯌꯨꯜ ꯑꯃꯥ ꯑꯣꯏꯅꯥ ꯏꯅꯁ꯭ꯇꯣꯜ ꯇꯧ꯫

ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯏꯝꯄꯣꯔꯠ ꯇꯧꯕꯥ꯫

ꯅꯍꯥꯛꯀꯤ ꯑꯦꯄꯀꯤ ꯑꯦꯟꯠꯔꯤ ꯄꯣꯏꯟꯇꯇꯥ ꯂꯥꯏꯟ ꯑꯁꯤ ꯍꯥꯄꯆꯤꯟꯗꯨꯅꯥ ꯕꯨꯇꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯏꯝꯄꯣꯔꯠ ꯇꯧ (ꯃꯍꯧꯁꯥꯅꯥ index.jsꯅꯠꯠꯔꯒꯥ app.js):

// You can specify which plugins you need
import { Tooltip, Toast, Popover } from 'bootstrap';

ꯅꯠꯔꯒꯥ, ꯀꯔꯤꯒꯨꯝꯕꯥ ꯅꯍꯥꯛꯅꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯄ꯭ꯂꯒꯏꯟ ꯈꯔꯈꯛꯇꯃꯛ ꯃꯊꯧ ꯇꯥꯔꯕꯗꯤ, ꯅꯍꯥꯛꯅꯥ ꯃꯊꯧ ꯇꯥꯕꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯄ꯭ꯂꯒꯏꯅꯁꯤꯡ ꯑꯃꯃꯃꯇꯥ ꯑꯣꯏꯅꯥ ꯏꯝꯄꯣꯔꯠ ꯇꯧꯕꯥ ꯌꯥꯏ:

import Alert from 'bootstrap/js/dist/alert';
...

ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯑꯁꯤ ꯄ꯭ꯔꯣꯄꯔꯇꯤꯗꯥ ꯁꯦꯡꯅꯥ ꯇꯥꯛꯂꯤꯕꯥ ꯄꯣꯄꯔꯗꯥ ꯌꯨꯝꯐꯝ ꯑꯣꯏ꯫ peerDependenciesꯃꯁꯤꯅꯥ ꯇꯥꯀꯄꯗꯤ ꯑꯗꯣꯝꯅꯥ ꯃꯁꯤ ꯑꯗꯣꯃꯒꯤ package.jsonꯁꯤꯖꯤꯟꯅꯕꯗꯥ ꯁꯣꯏꯗꯅꯥ ꯍꯥꯄꯆꯤꯅꯒꯗꯕꯅꯤ npm install @popperjs/core.

ꯁ꯭ꯇꯥꯏꯂꯁꯤꯡ ꯏꯝꯄꯣꯔꯠ ꯇꯧꯕꯥ꯫

ꯄ꯭ꯔꯤꯀꯝꯄꯥꯏꯜ ꯇꯧꯔꯕꯥ ꯁꯥꯁ ꯏꯝꯄꯣꯔꯠ ꯇꯧꯕꯥ꯫

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

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

@import "custom";
@import "~bootstrap/scss/bootstrap";

ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯀꯝꯄꯥꯏꯜ ꯇꯧꯅꯕꯒꯤꯗꯃꯛ, ꯅꯍꯥꯛꯅꯥ ꯃꯊꯧ ꯇꯥꯕꯥ ꯂꯣꯗꯔꯁꯤꯡ ꯏꯅꯁ꯭ꯇꯣꯜ ꯇꯧꯕꯥ ꯑꯃꯁꯨꯡ ꯁꯤꯖꯤꯟꯅꯧ ꯍꯥꯌꯕꯥ ꯁꯣꯌꯗꯅꯥ ꯈꯪꯗꯣꯀꯎ: sass-loader , Autoprefixerꯒꯥ ꯂꯣꯌꯅꯅꯥ postcss -loader . ꯃꯤꯅꯤꯃꯝ ꯁꯦꯇꯑꯄꯀꯥ ꯂꯣꯌꯅꯅꯥ, ꯅꯍꯥꯛꯀꯤ ꯋꯦꯕꯄꯦꯛ ꯀꯅꯐꯤꯒꯔꯗꯥ ꯔꯨꯜ ꯑꯁꯤ ꯅꯠꯠꯔꯒꯥ ꯃꯁꯤꯒꯥ ꯃꯥꯟꯅꯕꯥ ꯌꯥꯑꯣꯒꯗꯕꯅꯤ:

// ...
{
  test: /\.(scss)$/,
  use: [{
    // inject CSS to page
    loader: 'style-loader'
  }, {
    // translates CSS into CommonJS modules
    loader: 'css-loader'
  }, {
    // Run postcss actions
    loader: 'postcss-loader',
    options: {
      // `postcssOptions` is needed for postcss 8.x;
      // if you use postcss 7.x skip the key
      postcssOptions: {
        // postcss plugins, can be exported to postcss.config.js
        plugins: function () {
          return [
            require('autoprefixer')
          ];
        }
      }
    }
  }, {
    // compiles Sass to CSS
    loader: 'sass-loader'
  }]
}
// ...

ꯀꯝꯄꯥꯏꯜ ꯇꯧꯔꯕꯥ ꯁꯤ.ꯑꯦꯁ.ꯑꯦꯁ

ꯅꯠꯔꯒꯥ, ꯅꯍꯥꯛꯅꯥ ꯅꯍꯥꯛꯀꯤ ꯄ꯭ꯔꯣꯖꯦꯛꯇꯀꯤ ꯑꯦꯟꯠꯔꯤ ꯄꯣꯏꯟꯇꯇꯥ ꯂꯥꯏꯟ ꯑꯁꯤ ꯍꯥꯄꯆꯤꯟꯗꯨꯅꯥ ꯕꯨꯠꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯁꯤꯖꯤꯟꯅꯅꯕꯥ ꯁꯦꯝ ꯁꯥꯕꯥ CSS ꯁꯤꯖꯤꯟꯅꯕꯥ ꯌꯥꯏ:

import 'bootstrap/dist/css/bootstrap.min.css';

ꯃꯁꯤꯒꯤ ꯀꯦꯁ ꯑꯁꯤꯗꯥ ꯅꯍꯥꯛꯅꯥ ꯅꯍꯥꯛꯀꯤ ꯍꯧꯖꯤꯛ ꯂꯩꯔꯤꯕꯥ ꯔꯨꯜ cssꯑꯗꯨ ꯋꯦꯕꯄꯦꯛ ꯀꯅꯐꯤꯒꯇꯥ ꯑꯈꯟꯅꯕꯥ ꯃꯣꯗꯤꯐꯤꯀꯦꯁꯟ ꯑꯃꯠꯇꯥ ꯌꯥꯑꯣꯗꯅꯥ ꯁꯤꯖꯤꯟꯅꯕꯥ ꯌꯥꯏ, ꯅꯍꯥꯛꯅꯥ sass-loaderꯁꯨꯞꯅꯒꯤ ꯁ꯭ꯇꯥꯏꯜ-ꯂꯣꯗꯔ ꯑꯃꯁꯨꯡ css- ꯂꯣꯗꯔ ꯈꯛꯇꯃꯛ ꯃꯊꯧ ꯇꯥꯗꯦ .

// ...
module: {
  rules: [
    {
      test: /\.css$/,
      use: [
        'style-loader',
        'css-loader'
      ]
    }
  ]
}
// ...