如何正确配置module.alias

Question

我想使用React Starter Kit在我的项目中使用webpack中的resolve.alias功能。

例如：

取而代之的是：

import Component from '../../components/Component

我想用

import Component from 'components/Component

我在config.js文件中添加了此配置：

resolve: {
  alias: {
    components: './src/components'
  }
}

此resolve.alias为与webpack捆绑但与React Starter Kit不兼容的项目启用别名。

Answer 1

您需要使用完整路径配置alias：

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

我不是使用别名，而是使用modules来＆＃34; mount＆＃34;我的整个src文件夹：

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

，假设我有一个dir结构，如：

src/
src/components/...
src/util/...
src/routes/...
src/views/...

让我写下这些类型的进口产品：

import C from 'components/C';
import foo from 'util/foo';
import routes from 'routes/blah';
...

Answer 2

怎么样？

import Component from 'components'