1

I have html file which has 3 script tags. I want to put these script tags in my vue.js file. i have added the html div element to by vue js file and it is getting rendered. but i am just not able to load script from html into vue. Below is my html file.

<html>
  <body>
    <script type="text/javascript">
      mxBasePath = "../editors/pure";
    </script>
    <script type="text/javascript" src="../editors/pure/js/mxClient.js"></script>
    <script src="../editors/dist/main.js"></script>
  </body>
</html>

I have tried to add my scripts in the mounted section of vue. Below is my vue.js file

import * as client from '../editors/pure/js/mxClient.js'
import * as mains from '../editors/dist/main.js'
mounted () {
    var z = document.getElementById('geApp')

    let recaptchaScript = document.createElement('script')
      recaptchaScript.setAttribute('src', client)

      z.appendChild(recaptchaScript)
      let processes = document.createElement('script')
      processes.setAttribute('src', mains)

      z.appendChild(processes)
      let basepath = document.createElement('script')
    basepath.innertext = 'mxBasePath = "../editors/pure"'
    z.appendChild(basepath)

  },

But i am getting the error as file not found.. I solved the problem by importing the src file but now i am getting the error as "one of the functionality is not defined."

Please can anyone help me in adding the scripts to vue.js file

prateeknaik
  • 71
  • 1
  • 7
  • 1
    Have you already had a look at this question about [js import into vue component](https://stackoverflow.com/a/50159338/6691953)? – Uchendu Mar 30 '20 at 07:20
  • yes i did from there only i tried the mounted section. but it doesnt work – prateeknaik Mar 30 '20 at 07:22
  • My main problem is the mxBasePath = "../editors/pure"; in html file.. i am unable to load tat. and another script "src="../editors/dist/main.js"" is a build project using webpack – prateeknaik Mar 30 '20 at 07:25
  • I think it may be possible that the variable `mxBasePath` is not yet defined when your javascript code is run. Hence you'd have to check that the variable is loaded before setting the value. If that does not help yet, please provide the full error message – Uchendu Mar 30 '20 at 07:50
  • ReferenceError: mxLoadResources is not defined is the full error msg. mxLoadResources resides in mxClient ...that is – prateeknaik Mar 30 '20 at 09:09
  • The problem is that `mxBasePath = "../editors/pure"`is executed before it has been initialized by one of your other scripts. You may check out what happens when you use the [async attribute](https://www.w3schools.com/tags/att_script_async.asp) while including a script. – Uchendu Mar 30 '20 at 09:20
  • I did check on the async attribute.. so i removed the async attribute and updated my question.. but still the same error is coming up. – prateeknaik Mar 30 '20 at 09:34

0 Answers0