ꯋꯦꯕꯄꯦꯛ ꯑꯃꯁꯨꯡ ꯕꯟꯗꯂꯔꯁꯤꯡ꯫
ꯋꯦꯕꯄꯦꯛ ꯅꯠꯠꯔꯒꯥ ꯑꯇꯩ ꯕꯟꯗꯂꯔꯁꯤꯡ ꯁꯤꯖꯤꯟꯅꯗꯨꯅꯥ ꯅꯍꯥꯛꯀꯤ ꯄ꯭ꯔꯣꯖꯦꯛꯇꯇꯥ ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯑꯁꯤ ꯀꯔꯝꯅꯥ ꯌꯥꯎꯍꯅꯒꯗꯒꯦ ꯍꯥꯌꯕꯗꯨ ꯇꯃꯁꯤꯜꯂꯨ꯫
ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯏꯅꯁ꯭ꯇꯣꯜ ꯇꯧꯕꯥ꯫
npm ꯁꯤꯖꯤꯟꯅꯗꯨꯅꯥ ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯑꯁꯤ Node.js ꯃꯣꯗ꯭ꯌꯨꯜ ꯑꯃꯥ ꯑꯣꯏꯅꯥ ꯏꯅꯁ꯭ꯇꯣꯜ ꯇꯧ꯫
ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯏꯝꯄꯣꯔꯠ ꯇꯧꯕꯥ꯫
ꯅꯍꯥꯛꯀꯤ ꯑꯦꯄꯀꯤ ꯑꯦꯟꯠꯔꯤ ꯄꯣꯏꯟꯇꯇꯥ ꯂꯥꯏꯟ ꯑꯁꯤ ꯍꯥꯄꯆꯤꯟꯗꯨꯅꯥ ꯕꯨꯇꯁ꯭ꯠꯔꯥꯄꯀꯤ ꯖꯥꯚꯥꯁ꯭ꯛꯔꯤꯞꯇ ꯏꯝꯄꯣꯔꯠ ꯇꯧ (ꯃꯍꯧꯁꯥꯅꯥ index.js
ꯅꯠꯠꯔꯒꯥ app.js
):
import 'bootstrap';
// or get all of the named exports for further usage
import * as bootstrap from 'bootstrap';
ꯅꯠꯔꯒꯥ, ꯀꯔꯤꯒꯨꯝꯕꯥ ꯅꯍꯥꯛꯅꯥ ꯑꯩꯈꯣꯌꯒꯤ ꯄ꯭ꯂꯒꯏꯟ ꯈꯔꯈꯛꯇꯃꯛ ꯃꯊꯧ ꯇꯥꯔꯕꯗꯤ, ꯅꯍꯥꯛꯅꯥ ꯃꯊꯧ ꯇꯥꯕꯒꯤ ꯃꯇꯨꯡ ꯏꯟꯅꯥ ꯄ꯭ꯂꯒꯏꯅꯁꯤꯡ ꯑꯃꯃꯃꯗꯥ ꯏꯝꯄꯣꯔꯠ ꯇꯧꯕꯥ ꯌꯥꯏ :
import Alert from 'bootstrap/js/dist/alert';
// or, specify which plugins you need:
import { Tooltip, Toast, Popover } from 'bootstrap';
ꯕꯨꯇꯁ꯭ꯠꯔꯥꯞ ꯑꯁꯤ ꯄ꯭ꯔꯣꯄꯔꯇꯤꯗꯥ ꯁꯦꯡꯅꯥ ꯇꯥꯛꯂꯤꯕꯥ ꯄꯣꯄꯔꯗꯥ ꯌꯨꯝꯐꯝ ꯑꯣꯏ꯫ 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'
]
}
]
}
// ...