相关疑难解决方法(0)

使用Webpack在vue.js项目中使用at('@')登录路径进行ES6导入

我正在开始一个新的vue.js项目,所以我使用vue-cli工具来构建一个新的webpack项目(即vue init webpack).

当我浏览生成的文件时,我注意到文件中有以下导入src/router/index.js:

import Vue from 'vue'
import Router from 'vue-router'
import Hello from '@/components/Hello' // <- this one is what my qusestion is about

Vue.use(Router)

export default new Router({
    routes: [
        {
            path: '/',
            name: 'Hello',
            component: Hello
        }
    ]
})
Run Code Online (Sandbox Code Playgroud)

我以前没见过@路径中的at符号().我怀疑它允许相对路径(也许?)但我想确定我理解它真正的作用.

我尝试在网上搜索,但无法找到解释(因为搜索"at sign"或使用文字字符@没有帮助作为搜索条件).

@在这条道路上做了什么(链接到文档会很棒)这是一个es6的事情?一个webpack的东西?一个vue-loader的东西?

UPDATE

感谢Felix Kling指出我关于同一个问题的另一个重复的stackoverflow问题/答案.

虽然对其他stackoverflow帖子的评论不是这个问题的确切答案(在我的情况下它不是一个babel插件)但它确实指出了我找到它的正确方向.

在vue-cli为你创建的脚手架中,基本webpack配置的一部分为.vue文件设置了一个别名:

项目中的别名位置

这有意义,因为它为您提供了来自src文件的相对路径,并且它删除.vue了导入路径末尾(通常需要)的要求.

谢谢您的帮助!

javascript ecmascript-6 webpack vue.js

211
推荐指数
3
解决办法
5万
查看次数

.js 和 .mjs 文件有什么区别?

我已经开始在一个基于 Node.js 的现有项目上工作。我只是想了解执行流程,在那里我遇到了一些*.mjs文件。我搜索了网络,发现这些是基于模块的 JS 文件。

我想知道它与*.js文件有什么不同(它有什么好处)?

javascript node.js mjs

103
推荐指数
3
解决办法
6万
查看次数

如何使用项目根目录中的文件路径在 NodeJS 中导入 JavaScript 文件?(而不是相对文件路径)

问题:

\n

如何使用项目根目录中的文件路径在 NodeJS 中导入 JavaScript 文件?(而不是相对文件路径)

\n

换句话说,我的团队正在尝试从语法样式 A过渡到语法样式 B(如下所示):

\n

语法风格A

\n
const source = require(\'../../../../../../source.js\');\n
Run Code Online (Sandbox Code Playgroud)\n

语法风格 B

\n
const source = require(\'src/source.js\'); // "src" is a direct subfolder of the project root\n
Run Code Online (Sandbox Code Playgroud)\n

我已经审阅了很多关于这个主题的帖子,但没有一个能够满足我的项目的要求......

\n
\n

项目要求:

\n
    \n
  • 要求#1:没有外部包(例如 Babel.js 或 Webpack),因为磁盘空间有限。另外,我们无法使用“npm install”安装任何东西。
  • \n
  • 要求#2:JavaScript 文件应该能够使用“项目根”文件路径而不是相对文件路径导入另一个 JavaScript 文件。(这将避免诸如“../../../../../../../script.js”之类的长相对路径,这可能会变得难以管理。)
  • \n
  • 要求#3:在源代码中的任意位置右键单击导入的类应该会弹出一个上下文菜单,其中包含“转到声明”选项(这将我们直接带到导入的文件)。此外,将 JavaScript 文件移动到 IDE 中的其他文件夹应该会自动更新所有引用。我们可以使用任何IDE。
  • \n
  • 要求#4:为了采用一致的方式导入脚本,我们将使用 NodeJS 的“require”关键字进行导入(而不是 JavaScript 的“import”关键字)。
  • \n
\n
\n

设置:

\n

以下是我的设置。Package.json是由WebStorm生成的,我没有更改它。

\n …

javascript require commonjs node.js webstorm

15
推荐指数
1
解决办法
8518
查看次数

如何欺骗 Node.js 将 .js 文件加载为 ES6 模块?

Node.JS 10 添加了对加载 ES6 模块的实验性支持,这些模块已经在浏览器中运行。这意味着我们最终可以为 Node.JS 和浏览器使用完全相同的文件,而无需任何转译或 polyfill。

除了我们不能。Node.js 需要.mjs将文件作为模块加载的扩展名。我尝试使用符号链接来欺骗节点,但节点绕过了它:

D:\web\lines>node --experimental-modules ES6test.mjs
(node:7464) ExperimentalWarning: The ESM module loader is experimental.
D:\web\lines\ES6test.js:6
import myLibrary from "./MyFile.mjs";
       ^^^^^^^^^^^^^^^
Run Code Online (Sandbox Code Playgroud)

我想不出任何其他解决方法来完成这项工作 - 这确实使整个 ES6 模块支持变得毫无用处。

其他人能想出一些技巧让 Node.js 忽略扩展吗?

javascript node.js ecmascript-6

5
推荐指数
1
解决办法
1万
查看次数