CODEWITHSUNDEEP
javascripthtmlvue.jsnode-modules
su3158
su3158

Reputation: 613

File not found in script

I've installed several libraries using NPM.
You have to load the file to use it there.All installed libraries are under the node_modules

The designation is like this.

<script src="../node_modules/vue/dist/vue.js"></script>

I'm sure it's on the server, I'm sure the URL of the script tag is correct And I get the following error in the script, even though it is specified like this

login.html:45 GET https://***/node_modules/vue/dist/vue.js net::ERR_ABORTED 404

The JS file I prepared separately is loaded, but the original vue.js is not, so an error is coming back.

That's what we're trying to do with VUE. I'm going to use Ajax to create an SPA

/* eslint-disable no-console */
const vue = require("vue"); //I added it, but it's still not working.
const axios = require("axios"); //I added it, but it's still not working.
var app = new Vue({
    el: "#app",
data: {
    url: "https://*****",
    user: "",
    password: "",
    res: ""
},
methods: {
    login: function () {
        axios.post(this.url, {
            user: this.user,
            password: this.password
        })
            .then(function (response) {
                this.res = response.data.d;
                if (this.res === true) {
                    //true
                } else {
                    //failed
                }
            })
            .catch(function (error) {
                alert('System error');
            });
    }
}

})

Upvotes: 0

Views: 651

Answers (3)

Rijosh
Rijosh

Reputation: 1554

This is how usually use it from node_module

import Vue from 'vue'; // this will check inside node_modules for the file and include

Upvotes: 1

mepley
mepley

Reputation: 539

Why not use a CDN?

This way, the browser will not have to download the Vue file from your server if it has already been cached. Also, you may be able to use the vue.min.js file which will load even faster than the normal Vue dist file...

For example, here is a script from cdnjs.com you could try:

<script
  src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.11/vue.min.js" 
  integrity="sha256-ngFW3UnAN0Tnm76mDuu7uUtYEcG3G5H1+zioJw3t+68=" 
  crossorigin="anonymous"></script>

Try replacing your script tag with this.

Upvotes: 1

Greyson R.
Greyson R.

Reputation: 460

Instead of loading the files through a script tag, use require() in your javascript. For example:

const express = require("express");
const vue = require("vue");

This will work on both the client and on the server.

Upvotes: 1

Related Questions