react import改为绝对路径

最近在使用react时发现路径用../../很不方便,特别是修改项目结构时,加减../都能改到吐血,

所有在网上找了半天webpack的配置,特此记录下

module.exports = (webpackConfig) => {
  const config = Object.create(webpackConfig);
  config.resolve = {
    extensions: ['.js', '.jsx', '.json', '.scss', '.css'],
    alias: {
      '@': `${__dirname}/src/`,
      'static': `${__dirname}/src/static/`,
      'utils': `${__dirname}/src/utils/`,
      'config': `${__dirname}/src/config/`,
      'views': `${__dirname}/src/views/`,
      'services': `${__dirname}/src/services/`,
      'components': `${__dirname}/src/components/`,
      'models': `${__dirname}/src/models/`
    }
  };
  return config;
};

  

调用

import {arrayNullToString} from 'utils/help/ArrayHelp'

  

不用再../了!