MQTT in Nativescript-Vue - vue.js

Im making a nativescript-vue project and I will utilize MQTT however I cant see any library related to it. However there are libraries for MQTT Nativescript for TS, JS, Angular.. Can I apply this to tns vue?

TypeScript / Angular / Vue, end of the day everything is just JavaScript. Especially when there is a feature available for NativeScript Core it should be easily accessible on the frameworks too, Angular / Vue.
Simply import the plugin in Vue and start using it, except removing the type declarations if you are using JavaScript for Vue development.

This question is solved when edusperoni officially continued the work of krislankford for nativescript-mqtt. This is the new repo of nativescript-mqtt: https://github.com/edusperoni/nativescript-mqtt and works in any nativescript templates.

Related

How to adapt Vue component for browser build?

I have a legacy web application which I have introduced Vue into in a few places, via CDN. I have upgraded it from Vue 2 to Vue 3. There is a component used there which breaks with Vue 3, but there is a Vue 3 version of it. However, the author states this: "The component is packaged mainly for use with bundlers, if you require a browser build - post an issue." I do require a browser build. Is there some easy way I can do this for myself? I wasn't planning to use a bundler for this application, so I'm hoping I can use the existing modules to create a .js file I can use from the browser?

calling react-expo react native professionals for third party library integration

I'm trying to integrate the react library called react-canvas-draw with expo.
the error in question is:
Component Exception - View config getter callback for component 'canvas' must be a function (received 'undefined'). Make sure to start component names with a capital letter.
I think its a babel config fix. converting es2015 to es7 or something then to react native code. I have no idea.
So I stopped using react-expo because it's a pain in the ass to configure all the settings with (Babel, es6, jest, eslint, etc & metro configs). I Generally know what all those packages do in layman's terms but I do not know anything with setting them up together and what goes where.
Instead I'm using npx create-react-native-app It comes pre-configured for what I'm doing and it has some neat feature like hot-reloading so it's just as fast in development. It's not as helpful as expo with ease of use with ios and android setup and exports but I can manage the configurations on my own.

material-components-web for vue js

I have a website based on Vue framework and webpack.
I came across this css framework developed by Google (Material Components Web) where you can directly get started using a cdn or an npm package. It worked extremely well for a simple html/javascript based website. But, I am having issues setting it up for the Vue project.
There are other wrappers available for Vue framework like Veutify and Vue Material. But, it comes with lot of additional stuff like the grid layout which I don't want the developers to follow as we are already using a flex layout. I only want the component library.
So, is there a way use the Material Components Web with the Vue framework?
I didn't get the Material Components Web working with the Vue framework. But I did found another light-weight material design framework i.e. Material Design Lite.
Note: It is not specific to any framework. It lets you add Material Design look to your website developed in any framework
You can easily get started with a wide variety of options like cdn, bower, npm or even by downloading the files.
Material Components Web has modular architecture. Each component or API is distributed as a separate package. It means that you can use them separately, although there are some dependencies.
Also there is "root" package - material-components-web, which just references all other packages.
By default, when you add a package, it will not be included in your app. You'll need to import component's SCSS and optionally JavaScript. Basically like you would use any other component.
Reference this Vue app template as an example. As you can see here, it references only subset of MDC's components/APIs.

What is the difference between importing Vue.js library and installing it via Vue-CLI?

Could you please explain what is the main difference between different Vue installation methods for building a one-page website (page routing) with Vue and an Electron app using Vue:
importing Vue.js library via <script>
installing it via Vue-CLI
This installation guide doesn't really help understand the difference.
Is my site / app going to work slower if I just import Vue via <script>?
The <script> include is for including the Vue library in your webpage just like you would any other JavaScript library. Vue will be available on the window object for you to access globally. All external JavaScript must be included like this one way or another, even if you use vue-cli.
vue-cli is just a tool which generates Vue projects from templates. The setup really depends on the template that you use; I imagine most people would probably use the webpack template for medium to large sized Vue projects. This will initialize a node project directory containing all files necessary to develop, debug, test and build a Vue project. Webpack takes care of bundling all modules into a single JavaScript bundle which is included into the webpage via <script>. You can also benefit from vue-loader which allows you to write Vue components in *.vue files.
Is my site / app going to work slower if I just import Vue via <script>?
I mean, not really, no (your development speed might be hindered though since you won't benefit from all the bells and whistles that vue-cli sets you up with). Your question applies more to the development approach that you will follow for developing a Vue web application.

Webpack HMR with React Native

Is there a recent Webpack HMR react-native boilerplate out there?
I am having trouble finding a best practice for integrating an existing setup with Webpack and HMR to be used with react-native and the react-native packager. The resources I found online on this topic are dated.
I know that it uses Facebook's watchman.
I also know of the webpack-watchman-plugin, but I don't think that will allow me to trigger a webpack build and serve the compiled assets to react-native. I know that watchman has -- trigger functionality, but don't think digging in the packager local CLI is the answer either.
I'm at a loss for finding decent documentation for Facebook's packager, and not sure where to get started on this. My goal is to take an existing boilerplate used for web React, and use the boilerplate setup for react-native. I understand about the rendering differences, this is mostly the build tool part.
I've resolved this issue by not trying to integrate webpack with react-native, but by not using webpack at all and using react-native's packager. Still working on it, but I like it so far! Using it for my Open-Source react-native boilerplate project, strangeluv-native