1. index.html 에서 추가시에는 bootstrap.css, jquery.js, bootstrap.js 파일을 직접 설정

<link rel="stylesheet" href="../node_modules/bootstrap/dist/css/bootstrap.css"> 
<script type="text/javascript" src="../node_modules/jquery/dist/jquery.js"></script>
<script type="text/javascript" src="../node_modules/bootstrap/dist/js/bootstrap.js"></script>

2. javascript에서는 import 를 통해 추가

import $ from "jquery";
import "bootstrap";

3.bootstrap css 추가

import "bootstrap/dist/css/bootstrap.css";

하지만 webpack 수행시 아래와 같이 error발생

ERROR in ./node_modules/bootstrap/dist/fonts/glyphicons-halflings-regular.ttf
...
ERROR in ./node_modules/bootstrap/dist/fonts/glyphicons-halflings-regular.woff2
...
ERROR in ./node_modules/bootstrap/dist/fonts/glyphicons-halflings-regular.woff
...
ERROR in ./node_modules/bootstrap/dist/fonts/glyphicons-halflings-regular.eot
...
ERROR in ./node_modules/bootstrap/dist/fonts/glyphicons-halflings-regular.svg
...

4.webpack.config.json에서 error의 확장자 파일에 대한 loader설정이 없어서 발생, 관련 loader 추가
추가 설치 및 설정 loader : file-loader

4-1. 우선 file-loader 설치
$npm install -s file-loader

4-2. webpack.config.json파일에 loader추가

...
loaders: [
...
{ test: /\.html$/, loader: 'raw' },
{ test: /\.(png|jpg|jpeg|gif|svg|woff|woff2|ttf|eot)$/, loader: 'file-loader' }
...

4-3. webpack 수행시 기존 woff2, ttf, svg파일이 아래 형태로 변환 후 bundle과 동일 folder에 write됨

...
448c34a56d699c29117adc64c43affeb.woff2
89889688147bd7575d6327160d64e760.svg
e18bbf611f2a2e43afc071aa2f4e1512.ttf
...

5.npm start를 통해 electron 실행 결과

1) 추가적으로 bootstrap version 4.0.0인 경우 아래와 같이 설치 후
$ npm install -save bootstrap@4.0.0-beta.3

2) webpack 수행시 popper.js 관련 error 발생

3) webpack.config.json에 popper plugin 추가

plugins: [
        new webpack.ProvidePlugin({
            $: 'jquery',
            jQuery: 'jquery',
            'window.jQuery': 'jquery',
            'Popper': 'popper.js'
        }),
    ]

4) bootstrap version 4.0.0사용시 webpack수행시 생성되던 부가적인 파일 사라짐…ㅡㅡ;;
굳이 위에 loader추가 불필요 할듯 함.