0

tried to use the bootstrap-vue for the first time but got issue upon compiling assets. When I run npm run watch, I got an error something like below.

Module parse failed: C:\projects\portfolio\node_modules\bootstrap-vue\lib\mixins\dropdown.js Unexpected token (110:8)
You may need an appropriate loader to handle this file type.
|     },
|     methods: {
|         ...clickOut.methods,
|         noop() {
|             // Do nothing event handler (used in visible watch)

 @ ./node_modules/bootstrap-vue/lib/mixins/index.js 2:0-38

app.js

import BootstrapVue from 'bootstrap-vue/dist/bootstrap-vue.esm';

Vue.component('b-navbar', require('./components/Navbar.vue'));

Navbar.vue

<template>
    <div>
         <!-- navbar contents here.. -->
    </div>
</template>
<script>
    import { bNavbar } from 'bootstrap-vue/lib/components'
    export default {
        components: { bNavbar }
    }
</script>

Expected result

Must display the navbar component

4
  • Just a shot in the blue: did you check your node version being >= 8.3? AFAIK "bootstrap-vue.esm" is the ES6 Module for Bootstrap-vue and the error is on the ES6 spread (...) Operator for properties to be more specifically. I've only setup Bootstrap-vue on webpack with vue-loader/babel 2015 preset (es6 to es5 transpilation) so am not quite sure if that actually works.
    – makadev
    Aug 17, 2017 at 15:03
  • @makadev, with npm -v it says 4.5.0
    – claudios
    Aug 17, 2017 at 15:07
  • Try npm version, as an example I got a pretty fresh install via brew (mac) and its ... npm: '5.3.0', ... node: '8.3.0', .... You may need to update^
    – makadev
    Aug 17, 2017 at 15:11
  • I got node: '6.6.0' I'll try to update thanks!
    – claudios
    Aug 17, 2017 at 15:16

1 Answer 1

0

It seems, that you try to use single BV component. In that case you need to setup your dev enviroment to be able to compile BV sources by installing babel plugin https://babeljs.io/docs/plugins/transform-object-rest-spread/ and configuring babel to include node_modules/bootstrap-vue/lib folder

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.