websocket封装思路是什么样的

我自己单页面html里写过了websocket功能。可以正常链接发送接受断线重连。但是我现在想要把这个websocket封装到js文件中。以达到一个项目就用这一个websocket来链接各种信息。就是比较通用的那种。
然后我现在项目是html的不是vue的，虽然会引入vue的语法，但是还是很多vue的东西用不了。所以看网上的代码基本都是封装到vue版本的。所有不是很懂。想要一个封装的思路，到底如何html页面调用这个js文件建立链接，并且可以接受到消息返还到页面上显示。