Socket.io client and server module for Nuxt. Just plug it in and GO
npm install nuxt-socket-io

!GitHub Workflow Status


Socket.io client and server module for Nuxt
* v3.x has been tested against Nuxt3 stable and socket.io@4.1.1. If you absolutely require socket.io@4.5.3 it's recommended to install it and follow the workaround.
* v2.x may contain breaking changes in it's attempt to get Nuxt3 reaady. npm i nuxt-socket@1 should help revert any breaking changes in your code.
* VuexOpts types and Namespace configuration types changed. Entries with the Record have been deprecated in favor of string-only entries, which are easier to work with.
* Package type is now "module". Entirely ESM.
* Tested against node lts (16.x).
* v1.1.17+ uses socket.io 4.x. You may find the migration here
* v1.1.14+ uses socket.io 3.x. You may find the migration here
* v1.1.13 uses socket.io 2.x.
1. Add nuxt-socket-io dependency to your project
* Nuxt 3.x:
``bash`
npm i nuxt-socket-io
* Nuxt 2.x:
`bash`
npm i nuxt-socket-io@2
2. Add nuxt-socket-io to the modules section of nuxt.config.js
`js`
{
modules: [
'nuxt-socket-io',
],
io: {
// module options
sockets: [{
name: 'main',
url: 'http://localhost:3000'
}]
}
}
3. Use it in your components:
`js`
{
mounted() {
this.socket = this.$nuxtSocket({
channel: '/index'
})
/ Listen for events: /
this.socket
.on('someEvent', (msg, cb) => {
/ Handle event /
})
},
methods: {
method1() {
/ Emit events /
this.socket.emit('method1', {
hello: 'world'
}, (resp) => {
/ Handle response, if any /
})
}
}
}
But WAIT! There's so much more you can do!! Check out the documentation:
> https://nuxt-socket-io.netlify.app/
There you will see:
- More details about the features, configuration and usage
- Follow me and the series on medium.com
- Socket.io Client docs here
- Socket.io Server docs here
1. Clone this repository
2. Install dependencies using yarn install or npm installyarn dev
3. Start development server using or npm run dev`