在脚本中找不到文件答案

【问题标题】：File not found in script在脚本中找不到文件
【发布时间】：2020-07-22 17:27:17
【问题描述】：

我已经使用 NPM 安装了几个库。
你必须加载文件才能在那里使用它。所有安装的库都在 node_modules 下

名称是这样的。

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

我确定它在服务器上，我确定脚本标签的 URL 是正确的我在脚本中收到以下错误，即使它是这样指定的

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

我单独准备的js文件加载了，但是原来的vue.js没有加载，所以又报错了。

这就是我们试图用 VUE 做的事情。我打算用Ajax创建一个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');
            });
    }
}

})

【问题讨论】：

您使用的是哪个服务器框架？快递？
@mepley 不，这是一个 Windows 服务器。
将Vue 中您需要它的“v”大写，看看这是否有效。例如：const Vue = require("vue");
@mepley 如果我这样重写，仍然无法使用 Vue，我知道该怎么做吗？

标签： javascript html vue.js node-modules

【解决方案1】：

不要通过脚本标签加载文件，而是在您的 javascript 中使用 require()。例如：

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

这将在客户端和服务器上都有效。

【讨论】：

【解决方案2】：

为什么不使用 CDN？

这样，如果 Vue 文件已经被缓存，浏览器就不必从你的服务器下载它。此外，您也许可以使用 vue.min.js 文件，该文件的加载速度甚至比普通的 Vue dist 文件还要快...

例如，您可以尝试以下来自 cdnjs.com 的脚本：

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

尝试用这个替换你的脚本标签。

【讨论】：

不使用CDN的原因是下载麻烦是最大的影响。并且因为使用 NPM 更容易与他人共享环境
你能进一步解释为什么你试图直接从 node_modules 文件夹中直接导入 vue.js 代码吗？为什么不按照@greyson-r 的建议要求它？另外，“下载麻烦是最大的影响”是什么意思？
我不知道如何导入npm install准备的文件，所以我使用脚本标签尝试下载是因为我认为在同一台服务器上下载会更快，因为网速出来的不多。
您尝试过@greyson-r 的建议吗？这是将 javascript 导入另一个 javascript 文件的正确方法。我很惊讶您正在尝试使用 npm，但不知何故还没有学会如何导入/需要模块。以下是有关此的一些信息：docs.npmjs.com/using-npm-packages-in-your-projects
我试过了，但它不起作用。我认为这是您可以使用 npm 安装但使用脚本标签导入的东西谢谢，这非常有帮助。

【解决方案3】：

这是node_module的常用用法

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

【讨论】：