vue實戰部分之引入bootstrap和JQ

爲了頁面的美觀，以及代碼的簡單，就想在vue中導入bootstrap。
過程很心酸，有一些問題還是沒有能夠解決。
先打開對應的文件目錄【如圖，目錄就應該爲D:\vue\vueByLearn\myTry】

我暫時實現的方式是手動添加bootstrap的。
自動方法實現，通過cmd輸入…install命令方法輸入的話，我這邊的一個問題就是bootstrap部分的樣式能夠實現，造成這樣的原因不清楚。

---

那我就來講一下，如何通過手動方式引入bootstrap吧。

1. 先從官網下載對應的bootstrap框架

下載地址：https://v3.bootcss.com/getting-started/#download

2. 將框架文件放置到某個地方（沒有固定的要求，但是assets文件主要是用來放樣式等，這樣放置比較符合初始框架的目的）

3. 開始配置相關的信息

打開如下圖所示的文件：

在此文件中分別添加如下代碼：
var webpack = require('webpack')

	plugins: [
	  new webpack.ProvidePlugin({
	    $: "jquery",
	    jQuery: "jquery"
	  })
	]

此時還沒有配置過JQ，在cmd中會報錯，導致無法正常運行，只需要在cmd中輸入：
npm install --save jquery
即可。
在main.js入口函數中引入相關的bootstrap文件

import './assets/bootstrap/js/bootstrap.min.js'
import './assets/bootstrap/css/bootstrap.min.css'

通過npm run dev重新運行項目。
測試結果：

自動引入的問題：
1、首先自動引入的情況，引入之後找不到對應的文件（jq和bootstrap）
2、當使用相關控件測試的時候，比如說導航欄等，樣式就無法同官網的一直。