Skip to content

Commit 919b89e

Browse files
ChernavskikhChernavskikh
committed
Add sass loader and vue-bootstrap
1 parent 5d7d373 commit 919b89e

File tree

8 files changed

+172
-74
lines changed

8 files changed

+172
-74
lines changed

‎package.json

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,9 +9,11 @@
99
"test:unit": "vue-cli-service test:unit"
1010
},
1111
"dependencies": {
12+
"bootstrap": "^4.5.2",
13+
"bootstrap-vue": "^2.17.3",
1214
"core-js": "^3.6.5",
1315
"register-service-worker": "^1.7.1",
14-
"vue": "^2.6.11",
16+
"vue": "^2.6.12",
1517
"vue-router": "^3.2.0",
1618
"vuex": "^3.4.0"
1719
},
@@ -23,8 +25,8 @@
2325
"@vue/cli-plugin-vuex": "~4.4.0",
2426
"@vue/cli-service": "~4.4.0",
2527
"@vue/test-utils": "^1.0.3",
26-
"sass": "^1.26.5",
27-
"sass-loader": "^8.0.2",
28-
"vue-template-compiler": "^2.6.11"
28+
"sass": "^1.26.11",
29+
"sass-loader": "^10.0.2",
30+
"vue-template-compiler": "^2.6.12"
2931
}
3032
}

‎src/assets/styles/main.scss

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
@import 'node_modules/bootstrap/scss/bootstrap.scss';
2+
3+
body {
4+
font-size: 16px;
5+
}

‎src/components/HelloWorld.vue

Lines changed: 2 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -6,30 +6,8 @@
66
check out the
77
<a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
88
</p>
9-
<h3>Installed CLI Plugins</h3>
10-
<ul>
11-
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
12-
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-pwa" target="_blank" rel="noopener">pwa</a></li>
13-
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-router" target="_blank" rel="noopener">router</a></li>
14-
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-vuex" target="_blank" rel="noopener">vuex</a></li>
15-
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-unit-jest" target="_blank" rel="noopener">unit-jest</a></li>
16-
</ul>
17-
<h3>Essential Links</h3>
18-
<ul>
19-
<li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
20-
<li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
21-
<li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
22-
<li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
23-
<li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
24-
</ul>
25-
<h3>Ecosystem</h3>
26-
<ul>
27-
<li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
28-
<li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
29-
<li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
30-
<li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
31-
<li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
32-
</ul>
9+
10+
<b-button variant="success">Button</b-button>
3311
</div>
3412
</template>
3513

‎src/main.js

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,16 @@
11
import Vue from 'vue'
2-
import App from './App.vue'
3-
import './registerServiceWorker'
4-
import router from './router'
5-
import store from './store'
2+
import App from '~/App.vue'
3+
import '~/registerServiceWorker'
4+
import router from '~/router'
5+
import store from '~/store'
6+
7+
import BootstrapVue from 'bootstrap-vue'
68

79
Vue.config.productionTip = false
810

11+
// Install BootstrapVue
12+
Vue.use(BootstrapVue)
13+
914
new Vue({
1015
router,
1116
store,

‎src/views/Home.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<template>
22
<div class="home">
33
<img alt="Vue logo" src="../assets/logo.png">
4-
<HelloWorld msg="Welcome test"/>
4+
<HelloWorld msg="Welcome"/>
55
</div>
66
</template>
77

‎vue.config.js

Lines changed: 20 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,22 @@
1+
const path = require('path');
2+
13
module.exports = {
2-
publicPath: '/vue-jest-example/'
4+
publicPath: '/vue-jest-example/',
5+
configureWebpack: {
6+
resolve: {
7+
alias: {
8+
"~": path.resolve(__dirname, 'src/')
9+
},
10+
extensions: [".js", ".vue", ".json"],
11+
},
12+
},
13+
css: {
14+
loaderOptions: {
15+
sass: {
16+
additionalData: `
17+
@import "~/assets/styles/main.scss";
18+
`,
19+
},
20+
},
21+
}
322
}

‎webpack.config.js

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
const path = require('path');
2+
3+
module.exports = {
4+
resolve: {
5+
extensions: ['.js', '.json', '.vue', '.ts'],
6+
root: path.resolve(__dirname, "src"),
7+
alias: {
8+
'@': path.resolve(__dirname, "src"),
9+
'~': path.resolve(__dirname, "src"),
10+
},
11+
},
12+
}

0 commit comments

Comments
 (0)