使用Webpack 2进行绝对导入的最佳方式是什么？

我在设立的WebPack配置为项目作出反应的过程中，我希望能够导入我的部件是这样的：使用Webpack 2进行绝对导入的最佳方式是什么？

import ComponentName from "components/ComponentName"

，而不是像这样：

import ComponentName from "../../components/ComponentName"

（这一切都假设我的components目录住在src目录内）

做了一点研究，到目前为止我已经找到了两种不同的方法来实现这个使用Webpack：

使用resolve.modules选择这样做我src目录内的WebPack解析模块：

 

    resolve: { 
     modules: [ path.resolve(__dirname, "src"), path.resolve(__dirname, "node_modules")] 
    }

使用别名选项命名我的组件目录别名：

 

    resolve: { 
     alias: { 
     components: path.resolve(__dirname, 'src/components/'), 
     } 
    }

所以，我的问题是，是否有任何优势使用一个特定方法比其他？

在此先感谢

当您使用别名，你可以导入喜欢你这个代码

resolve: { 
    alias: { 
    AliasName: path.resolve(__dirname, 'src/components/'), 
    } 
} 

import Comp from 'AliasName/Comp'

在哪里，当你不使用别名，你的代码看起来像这样

resolve: { 
    modules: [ path.resolve(__dirname, "src"), path.resolve(__dirname, 
    "node_modules")] 
} 

import Comp from 'components/Comp'

我的将与别名一起使用，因为它看起来很干净，但没有真正的优势。只是外观和感觉

2017-07-29 01:32:57

回答