CODEWITHSUNDEEP
vue.js
محمد ربيع الشيخة
محمد ربيع الشيخة

Reputation: 51

import js file inside .vue component loaded using httpVueLoader

i want to not use webpak form my vue devlopement, so there is 2 alternative writting components as .js file or writing them as .vue file and use httpVueLaoder to load component as if they are .js file with httpvueLoader think go grate untile the time i want to use an API inside my component ther i can not get the API i have a Home.vue componet inside ther is a FormLot.vue component in witchi try to import API.js

<script>
let FormLot = window.httpVueLoader('./frontEnd/page/lot/FormLot.vue')
module.exports = {
    name:"Home",
     components: {FormLot:FormLot},
...    
};
</script>

in FormLot.vue

// _END_ is the absolut path to the site , soi can change it later
let API = import(_END_+'/api/api.js') // dont work return promise
import API from './frontEnd/api/api.js' // dont work componnet dont show at all :(

 let FormLotE1 = window.httpVueLoader(_END_+'/page/lot/FormLotE1.vue')

module.exports ={
    ...
};
</script>

API.JS

module.exports ={
   ...
};

API.JS

export default {
   ...
};

with API.js i tryed export default and module.export bothe dont work nota when using webpack API.js got been normaly imported and work fine

Upvotes: 1

Views: 1355

Answers (1)

محمد ربيع الشيخة
محمد ربيع الشيخة

Reputation: 51

when using import API from path httpVueLaoder dont work so i tried to do 

const API= import(path)

problem witch that ,API is promise ,wich can notbe used :( using await dontsolve the problem even when using

const API = (async ()=> await import(path))()

my solution still to call import using await but not in the top of the script i call it in the mounted() function 

async mounted(){

                     API = (await import(_END_+'/api/api.js')).default

    },

note that you must use .default because import return a module :) enter code here

Upvotes: 1

Related Questions