在Webpack中，可以通过以下几个步骤来避免重复的代码块：

1. 使用splitChunks插件：Webpack提供了一个splitChunks插件，可以将共享的代码块提取到单独的文件中，避免重复打包。可以在Webpack配置文件中进行如下配置：

module.exports = {
  // ...
  optimization: {
    splitChunks: {
      chunks: 'all',
    },
  },
};

2. 使用动态导入（Dynamic import）：在Webpack 2及以上版本中，可以使用动态导入来按需加载模块。这样，只有在需要使用模块时才会被加载，避免了重复的代码块。

import(/* webpackChunkName: "myModule" */ './myModule').then((module) => {
  // 使用module
});

3. 使用Code Splitting：通过Code Splitting将代码划分为多个小块，每个小块对应一个单独的文件。这样可以避免重复加载相同的代码块。

import module1 from './module1';
import module2 from './module2';

// 使用module1和module2

4. 使用缓存：Webpack在打包时会生成带有哈希值的文件名，可以通过配置缓存策略来利用浏览器缓存，避免重复加载相同的代码块。

module.exports = {
  // ...
  output: {
    filename: '[name].[contenthash].js',
  },
};

通过以上方法，可以有效地避免重复的Webpack代码块。