chrisgrim's avatar

Error loading Vue AirBnB Style DatePicker

Hi Guys,

I have been following the vue tutorials but this is the first time I have tried to load a vue component from git. I am trying to load this airbnb style date picker and having an issue. On the install page https://mikaeledebro.gitbooks.io/vue-airbnb-style-datepicker/INSTALLATION.html

I have installed the picker and date-fns with npm. Then when I add the following to my app.js I get an error

import Vue from 'vue'
import App from './App.vue'
// import component and stylesheet
import AirbnbStyleDatepicker from 'vue-airbnb-style-datepicker'
import 'vue-airbnb-style-datepicker/dist/vue-airbnb-style-datepicker.min.css'

// see docs for available options
const datepickerOptions = {}


// make sure we can use it in our components
Vue.use(AirbnbStyleDatepicker, datepickerOptions)

new Vue({
  el: '#app',
  render: h => h(App),
})

Here is the error in console

Uncaught Error: Cannot find module "./App.vue"

If I try to remove the import App from './App.vue' I get

 Error in render: "ReferenceError: App is not defined"

Thanks Chris

0 likes
6 replies
ftiersch's avatar

Is "App.vue" in the same directory as your app.js?

chrisgrim's avatar

I am loading vue with a cdn. So I believe I don't have an App.vue. I definitely don't see an App.vue in the same directory as app.js.

ftiersch's avatar

In that case importing an app vue doesn't make sense ;-) And also importing Vue probably doesn't make sense at that point if it's coming from a CDN and not from npm.

chrisgrim's avatar

Ha thats sorta what I thought. When I remove them I get the error

Uncaught ReferenceError: Vue is not defined and it refers to this line in the code

Vue.use(WEBPACK_IMPORTED_MODULE0vue_airbnb_style_datepicker["a" /* default */], datepickerOptions);

Is the Vue.use what is causing my issue since I dont have vue loaded?
ftiersch's avatar
ftiersch
Best Answer
Level 28

Probably, yes.

I'd just install vue via npm and then use it like that. Or is there a special reason why you use it from a CDN?

chrisgrim's avatar

Haha I guess just because that is how the vue tutorials on here showed it :) I will give that a shot. Thanks!

Please or to participate in this conversation.