Vue安装 Bootstrap Scss

1.安装scss

1. 下载依赖包
   cnpm install node-sass sass-loader -D
2. 在build文件夹下的webpack.base.conf.js的rules里面添加配置

{
  test: /\.sass$/,
  loaders: ['style', 'css', 'sass']
}

3.在APP.vue中修改style标签

<style lang="scss">

4.安装完成，启动项目。

2.安装bootstrap

1. 想要在vue中引入bootstrap，引入的时候需要按照如下的步骤进行。
   1、引入jquery
   2、引入bootstrap

2. 下载 jquery cnpm install jquery --save-dev

3. 进行配置
   1.在webpack.base.conf.js中添加如下内容：var webpack = require(‘webpack’)
   2.`// 增加一个plugins

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

   3. 在main.js中添加内容
      import $ from ‘jquery’

4. jquery引入成功

5. 安装bootstrap，使用命令npm install bootstrap --save-dev

6. 安装成功后，能够在package.json文件夹中看到bootstrap这个模块。这时候需要在main.js中添加如下内容：

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

7.（引入bootstrap路径视个人情况而定。也可将bootstrap引入到src 下的assets下）

8.添加完成后，重新启动程序，npm run dev。