Webpack+Bootstrap Select 点击第一次不弹出再次点击后正常问题

Webpack+Bootstrap Select 点击第一次不弹出再次点击后正常问题

环境

• NPM 6.11.3
• Webpack 3.6.0
• Vue 2.5.2
• Bootstrap 4.3.1
• Bootstrap Select 1.13.12

问题出现

Vue工程，使用Webpack打包引入bootstrap和bootstrap，npm run dev开发模式， select后，出现现象，第一次点击select不能正确弹出下拉框，再次点击恢复正常

排查过程

1. 使用Chrome跟踪代码发现，第一次点击select，<div class="dropdown-menu ">可以生动生成，对比正确的，发现未正确添加class show。
2. 跟踪代码发现click之后,bootstrap-select，会正确的设置为<div class="dropdown-menu show">但很快会被bootstrap中的另一个动作将show去掉，导致下拉未正确显示
3. 原是引入的bootstrap.min.js，所以打算改为bootstrap.js跟踪下源码。结果发现替换为bootstrap.js后，问题修复。

bootstrap.min.js为何会多触发一次暂未详查原因

问题修复

将代码中的bootstrap.min.js替换为未压缩的bootstrap/dist/js/bootstrap。

原代码的引入

import 'bootstrap/dist/js/bootstrap.min.js'

修复后的代码引入

import 'bootstrap'

开发时引入的js，可以引入未压缩混淆处理的，以便查找问题，默认build后的js一样会压缩混淆。