I'm developing a full stack application that consists of two systems, one with a printer and one hosted remotely handling a web-based "slot-machine" style app that provides a string to be printed on the other system.
I already created the communication and printer connection components based on python. I read on the subject of the web part and realised that the best would likely be to use nginx to serve the pages to the visitors. Initially I had considered directly using django (instead of flask), but because there might be a bit too much of concurrency and updating the page from the server side might cause slowdowns or even crash it, I believe that some sort of javascript based implementation would be best. Most of my experience is outside of javascript so there's quite the barrier here, nevertheless I found vue.js to appear quite intuitive. I found a slot-machine that would match 50% of my requirements, namely the first example in it's description.
What I want to do on the webpage is simple: the slot machine rolls on page load, the person presses a button and it stops. The position where it stops is sent to the backend and the subsequent processing does not seem to be out of reach for me. Unlike the webpage at this point.
I created a npm environment on my system, installed vue and installed the package, as per the readme. However, independently of how and where I try to load it, vue is never able to find it.
I tried adding to the body of index.html:
<script src="https://raw.githubusercontent.com/josex2r/jQuery-SlotMachine/master/dist/jquery.slotmachine.js"></script>
Inside app.vue, I tried loading it inside the script part in all these different manners:
var SlotMachine = require('jquery_slotmachine.js');
import SlotMachine from "jquery-slotmachine"
import SlotMachine from './components/jquery.slotmachine.js'
import SlotMachine from '@/components/jquery.slotmachine.js'
import * as SlotMachine from '../src/components/jquery.slotmachine.js'
import SlotMachine from "jquery_slotmachine.js"
None of which resulting in anything. Not even on the export component:
export default {
name: 'App',
components: {
HelloWorld
},mounted() {
const plugin = document.createElement("script");
plugin.setAttribute(
"src",
"@/components/jquery.slotmachine.js"
);
plugin.async = true;
document.head.appendChild(plugin);
}
};
Any idea/help?
Thank you in advance!
#Edit:
<script src="https://raw.githubusercontent.com/josex2r/jQuery-SlotMachine/master/dist/jquery.slotmachine.js"></script>
Typo when writing on stackoverflow. Issue still applies.
Aucun commentaire:
Enregistrer un commentaire