ch03 使用webpacker安裝bootstrap

https://www.youtube.com/watch?v=bn9arlhfaXc

高見龍網頁

https://medium.com/@hitobias/rails-6-%E4%BD%BF%E7%94%A8-bootstrap-6201ec4df75e

rails 安裝 bootstrap
make new app

$ rails new bootstrappy 創造rails app
$ cd bootstrappy 進入資料夾
$ yarn add bootstrap jquery popper.js 使用 yarn 創建bootstrap

一、首先創建app

rails new MyApp

二、用 Yarn 安裝Bootstrap及相關套件

cd MyApp

yarn add bootstrap jquery popper.js

三、設定Webpacker

打開 config/webpack/environment.js, 加入以下代碼：

const { environment } = require('@rails/webpacker');

const webpack = require('webpack');

environment.plugins.append(

'Provide',

new webpack.ProvidePlugin({

$: 'jquery',

jQuery: 'jquery',

Popper: ['popper.js', 'default'],

})

);

module.exports = environment;

四、app/javascript/packs/application.js, 加入以下代碼：

webpack裡面要抓出來使用的套件

require('bootstrap');

五、app/assets/stylesheets/application.css, 加入以下內容：

引入css內容

@import 'bootstrap/scss/bootstrap'