Skip to main content

resolve.alias

创建 import 或 require 的别名，来确保模块引入变得更简单。例如，一些位于 src/ 文件夹下的常用模块：

Quest Start​

webpack.config.js

const path = require('path');

module.exports = {
  //...
  resolve: {
    alias: {
      Utilities: path.resolve(__dirname, 'src/utilities/'),
      Templates: path.resolve(__dirname, 'src/templates/'),
    },
  },

使用场景​

指定根路径​

webpack.config.js

module.exports = {
  //...
  resolve: {
    alias: {
      '@src': path.resolve(basePath, './src'),
      '@': path.resolve(basePath),
    },
  },

指定第三方包路径​

webpack.config.js

module.exports = {
  //...
  resolve: {
    alias: {
      Chip: !isEdit
          ? '@ifeng/visualediting/src/components/ChipView'
          : '@ifeng/visualediting/src/components/Chip',
      // 可视化编辑组件，在展示模式下，只需要加载一个空组件，这样可以将可视化的业务代码放在内网。
      ChipEdit: !isEdit
          ? '@ifeng/visualediting/src/components/ChipEditView'
          : '@ifeng/visualediting/src/components/ChipEdit',
      // 数据转换组件。
      chipDataTransform: !isEdit
          ? '@ifeng/web-server/src/common/transformView.js'
          : '@ifeng/web-server/src/common/transform.js',
      ThreeTerminal_base: '@ifeng/three_terminal/es/base',
      ThreeTerminal_mobile: '@ifeng/three_terminal/es/mobile',
      ThreeTerminal_pc: '@ifeng/three_terminal/es/pc',
      ThreeTerminal_mobile_dynamic: '@ifeng/three_terminal/es/mobile/dynamic',
      ThreeTerminal_pc_dynamic: '@ifeng/three_terminal/es/pc/dynamic',
      ThreeTerminal_utils: '@ifeng/three_terminal/es/utils',
    },
  },

参考​