Блог

У меня есть несколько конфигураций webpack с разными точками входа для создания разных пакетов, и некоторые из них используют некоторые модули. Я пытаюсь настроить дерево неиспользуемых экспортных данных, но при следующей настройке мои пакеты в конечном итоге содержат ВСЕ экспортные данные внутри, из каждого возможного модуля, хотя большинство из них нигде не импортированы. Что я делаю не так?

‘index.ts’ используется в качестве примера для одной из этих точек входа.

структура папок:

 src/
    /shared-modules
    ...
    index.ts
    other.ts
    ...
  

webpack.config.js:

 {
  entry: {
    index: './src/index.ts',
  },
  output: {
    path: path.resolve(__dirname, `dist/${ env }`),
      filename: 'index.js'
    },
    module: {
      rules: [
        {
          test:/.ts$/i,
          include: path.resolve(__dirname, 'src'),
          use: ['babel-loader', 'ts-loader'],
          exclude: /node_modules/
        }
      ]
    },
    resolve: {
      extensions: ['.webpack.js', '.web.js', '.ts', '.js']
    },
    mode: 'production',
    optimization: {
      usedExports: true,
      minimize: true,
      minimizer: [
        new TerserPlugin()
      ]
    }
  }
}
  

.babelrc:

 {
  "presets": [
      [
          "@babel/preset-env",
          {
              "modules": false
          }
      ]
  ]
}
  

tsconfig.json:

 {
  "files": [
    "src/index.ts",
    "src/other.ts"
  ],
  "compilerOptions": {
    "module": "ES6",
    "moduleResolution": "Node",
    "target": "ES5",
    "sourceMap": true,
    "lib": ["ES2015", "ES2017", "DOM"]
  },
  "exclude": [
    "node_modules"
  ]
}
  

package.json:

 {
  "name": "script",
  "type": "commonjs",
  ...
  "sideEffects": [
    "./src/index.ts"
  ],
  ...
}
  

Возможно, вам потребуется настроить побочные эффекты в вашем package.json. например:

 {
  "name": "your-project",
  "sideEffects": false
}
  

Однако, если в вашем коде были какие-то побочные эффекты, вместо этого можно предоставить массив:

 {
  "name": "your-project",
  "sideEffects": ["./src/some-side-effectful-file.js"]
}