This dependency was not found:

• vuelidate in ./src/main.js

minor error which students should be able to diagnose by this stage of the course, caused me some delay and annoying, hence the request to fix.

@ 05:00 in the vuex-state-getters lesson.
https://www.vuemastery.com/courses/mastering-vuex/vuex-state-getters

adding this code to EventCreate.vue

and
computed: mapState({
user: 'user',
categories: 'categories'
})

during the video, omitted adding categories in store.js
state: {
user: { id: 'abc123', name: 'adam Jahr' },
categories: [
'sustainability',
'nature',
'animal welfare',
'housing',
'education',
'food',
'community'
]
},

without categories in store.js the following error appears.

There was an error:
[actually more messages appear if you expand the feedback in developers console, but the error is not easy to recognize or diagnose, a broader problem I haven't worked on in this stack]

other unrelated issues/questions while I'm here. :)
Refreshing the app is not as simple as refreshing the page.
Not sure if hot reloading is the solution > https://vue-loader.vuejs.org/guide/hot-reload.html
Would really like to see a video explaining how to debug apps properly.

at 0:36 in the Success & Error Notifications lecture the code incorrectly references error.response when error.message should be used.

console.log('there was an error:', error.response)

https://www.vuemastery.com/courses/mastering-vuex/success-error-notifications

It's a relatively minor error, quite annoying until you realize how simple it is to fix.

This is fixed later in the video when
console.log('there was an error:', error.response)
is replaced by
console.log('there was an error:', error.message)

code source of the branch is missing the date picker package, please include it

The src/main.js file uses a package called vuelidate, which is not in package.json
It needs to be fixed so that those watching the course can download, run npm install and stream with it and not start troubleshooting

Hello, I can't figure out where should the EventEdit component's event data put.

• EventList: state
• EventShow: state
• EventCreate: data
• EventEdit: ?

Thank you <3

In release vuelidateP2-finish in the BaseSelect.vue v-on="$listeners" causes the same conflict that is caused in the BaseInput.vue component. However, the source code implement the solution only for the BaseInput.vue component.

Solution

Use v-on="listeners" instead of v-on="$listeners" and add

computed: {
      listeners() {
        return {
          ...this.$listeners,
          input: this.updateValue
        }
      }
    }

to your BaseSelect.vue component

test

Hi
your project work fine, but I am trying to integrate in a personal project, the only thing that doesn't work, is when I set

In index.html I immediately had this error:

Template execution failed: ReferenceError: BASE_URL is not defined

To run my application I use :
npm run dev

I have already installed lodash dependecy, but the problems seems to not be in the dependencies.
What can I do?
Thank you

audited 856 packages in 2.821s

84 packages are looking for funding
run npm fund for details

found 0 vulnerabilities

PS C:\Users\32479\Desktop\RWV\real-world-vue-master> npm run serve

[email protected] serve C:\Users\32479\Desktop\RWV\real-world-vue-master
vue-cli-service serve

ERROR TypeError: Cannot read property 'version' of undefined
TypeError: Cannot read property 'version' of undefined
at module.exports (C:\Users\32479\Desktop\RWV\real-world-vue-master\node_modules@vue\cli-plugin-eslint\index.js:21:27)
at C:\Users\32479\Desktop\RWV\real-world-vue-master\node_modules@vue\cli-service\lib\Service.js:82:9
at Array.forEach ()
at loadedCallback (C:\Users\32479\Desktop\RWV\real-world-vue-master\node_modules@vue\cli-service\lib\Service.js:80:20)
at Service.init (C:\Users\32479\Desktop\RWV\real-world-vue-master\node_modules@vue\cli-service\lib\Service.js:97:14)
at Service.run (C:\Users\32479\Desktop\RWV\real-world-vue-master\node_modules@vue\cli-service\lib\Service.js:247:16)
at Object. (C:\Users\32479\Desktop\RWV\real-world-vue-master\node_modules@vue\cli-service\bin\vue-cli-service.js:37:9) at Module._compile (internal/modules/cjs/loader.js:1085:14)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1114:10)
at Module.load (internal/modules/cjs/loader.js:950:32)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] serve: vue-cli-service serve
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] serve script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\32479\AppData\Roaming\npm-cache_logs\2022-04-22T17_02_17_534Z-debug.log

Code breaks after an npm upgrade. Cannot create a new event with final version of the code

Run a:

npm upgrade

then run the code with the json-server.

The code breaks when we try to create a new event from the UI.

Here is the Error from the DevTools

Invalid prop: type check failed for prop "value". Expected String, Number, got Event 

found in

---> <BaseSelect> at src/components/BaseSelect.vue
       <EventCreate> at src/views/EventCreate.vue
         <App> at src/App.vue
           <Root>

Working through the vuex mutations and actions lesson.
https://www.vuemastery.com/courses/mastering-vuex/vuex-mutations-actions-1

The video @ 6:56 does not have this line
import { mapState, mapGetters } from 'vuex'

https://github.com/Code-Pop/real-world-vue/releases/tag/lesson12-mutations%26actions1-start

it's a minor issue, but would be good for the code to match the video. thanks :)

First, thanks for building this project! Really enjoying the https://vuemastery.com content. 😄

Second, right now this code is technically "All Rights Reserved" and not licensed. ChooseALicense.com (by GitHub) has more info on what can (and mostly can't) be done with code that has no license: https://choosealicense.com/no-permission/

Would y'all be open to adding a license to this code, so folks taking the tutorials can build up from what they use here?

Thanks!
🎩

The start tag's code for Lesson 11 has the event-create and event-show routes out of order. The "finish" tag's code has it fixed and course notes in the Mastering Vuex Orientation shows it setup right but I don't believe it's ever mentioned in the video that it needs to be reordered.

This:

export default new Router({
  mode: 'history',
  routes: [
    {
      path: '/',
      name: 'event-list',
      component: EventList
    },
    {
      path: '/event/:id',
      name: 'event-show',
      component: EventShow,
      props: true
    },
    {
      path: '/event/create',
      name: 'event-create',
      component: EventCreate
    }
  ]
})

Should be:

export default new Router({
  mode: 'history',
  routes: [
    {
      path: '/',
      name: 'event-list',
      component: EventList
    },
    {
      path: '/event/create',
      name: 'event-create',
      component: EventCreate
    },
    {
      path: '/event/:id',
      name: 'event-show',
      component: EventShow,
      props: true
    }
  ]
})

I followed the lessons carefully. But When I made the API call using axios from a dummy database (db.json) I don't see the events on the EventList page. I did not use any style as mention in the lessons. Also created a very small API just for testing purpose.

db.json:
{ "events":[ { "id": 1, "title": "StreetVibez" }, { "id": 2, "title": "BuildItUp" }, { "id": 3, "title": "RandomCircle" } ] }
EventsList.vue:

`

EventCard.vue:

I keep getting the following error after selecting an option (category or time) in one of the drop-down lists in the example app's "Create event" form:
"Invalid prop: type check failed for prop "value". Expected String, Number, got Event ".

This error occurred after I followed the tutorial on creating reusable form components (on https://www.vuemastery.com/courses/next-level-vue/Reusable-Form-Components-BaseSelect) .
I see nothing wrong in the source code. I even downloaded the course's own source code and replaced my own, but the error prevails.

Is this a known issue?

Hello,

It seems, when you create a vue app today with vue-cli 3, it doesn't create a src\router.js, but instead src\router\index.js.
There might be other changes in the source structure. It'd be great if you update your source code, so we can save our time.

Thanks.

Hi, I've just cloned the repo, then I did npm install and I had to fix 2 issues with npm audit fix as suggested by npm, now when I run npm run serve I got this:

These dependencies were not found:

* vuelidate in ./src/main.js
* vuelidate/lib/validators in ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./src/views/EventCreate.vue?vue&type=script&lang=js&

To install them, you can run: npm install --save vuelidate vuelidate/lib/validators


This relative module was not found:

* ./filters/date in ./src/main.js

I tried npm install --save vuelidate vuelidate/lib/validators as suggested but nothing help.
I'm running npm v6.4.1, any idea?

I the State & Getters lesson of the Mastering VUEX series, it would have been nice if the events object was listed in the body of the lesson. I had to download the finished example to grab a copy of it.
Thanks and Cheers!

deleted.

real-world-vue-filters_finish

This relative module was not found:

• ./filters/date in ./src/main.js

Missing dependencies during serve,

These dependencies were not found:                                                                                                                                                              * vuelidate in ./src/main.js                                                                    * vuelidate/lib/validators in ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/
babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib
??vue-loader-options!./src/views/EventCreate.vue?vue&type=script&lang=js&                                                                                                                       To install them, you can run: npm install --save vuelidate vuelidate/lib/validators