简体繁体 English

我应该在 JS 导入 (Vue.js/Nuxt.js) 中使用 @ 还是 ~？

[英]Should I be using @ or ~ in JS imports (Vue.js/Nuxt.js)?

原文 2020-05-07 19:41:47 6 2 javascript/ vue.js/ webpack/ nuxt.js

I'm sorry if this is a duplicate but I couldn't find the appropriate answer to my question.如果这是重复的，我很抱歉，但我找不到我的问题的适当答案。

As you might know, Webpack has an alias for the root dir which is ~ .您可能知道， Webpack 的根目录有一个别名~ 。 That said, I have seen many people use the @ symbol when importing modules using ES6 syntax.也就是说，我看到很多人在使用 ES6 语法导入模块时使用@符号。 Both works when importing modules.导入模块时两者都有效。

My question is this... Is there any consequences by using the ~ symbol when importing modules in pages and components or is it just a best practise to be using @ ?我的问题是......在页面和组件中导入模块时使用~符号是否有任何后果，或者使用@只是最佳实践？ I use ~ since there is less chance for me to mix up the two since the nuxt.config.js file does not support the use of @ .我使用~ ，因为nuxt.config.js文件不支持使用@ ，所以我不太可能混淆两者。

2 个解决方案

There is no standard way of referencing a root folder in JS.在 JS 中没有引用root文件夹的标准方法。 From my knowledge this is not specified in any specs.据我所知，这没有在任何规格中指定。

Both ~ and @ are defined by whatever package bundler your using. ~和@都由您使用的任何 package 捆绑器定义。

In this case going with whatever is standard for that environment should be fine.在这种情况下，使用该环境的标准应该没问题。

I'm more used with @ because that's the default for vue.js/webpack installs, but I would use anything that comes out of the box with a different setup.我更喜欢使用@ ，因为这是 vue.js/webpack 安装的默认设置，但我会使用开箱即用的任何东西，但设置不同。

The ~ -prefix is used to resolve the import from the node_modules -path. ~ -prefix 用于解析来自node_modules -path 的导入。 The @ -prefix is set-up in Vue to resolve the import from the src -path. @ -prefix 在 Vue 中设置以解析从src -path 的导入。