javascript - Utilizarea webpack pentru a produce un pachet de furnizori și fișiere sursă unu-la-unu

Cum pot folosi webpack (v2.x) pentru a produce un singur pachet pentru vendor și fișiere sursă separate?

De exemplu:

• src/

  • test.html
  • test.ts

Unde test.ts importă lodash.

Vreau să afișez:

• construire/

  • vendor.js (lodash în acest caz și orice logică webpack)

  • src/

    • test.html
    • test.js

Există o modalitate de a face asta?

Configurația mea actuală webpack:

const webpack = require('webpack');
const { CheckerPlugin } = require('awesome-typescript-loader');
const glob = require('glob');
const path = require('path');

const srcDir = path.join(__dirname, 'src');
const buildDir = path.join(__dirname, 'build');

module.exports = {
  bail: true,
  devtool: 'source-map',
  entry: glob.sync('./src/**/*'),
  output: {
    path: buildDir,
    filename: '[name].js'
  },
  resolve: {
    extensions: ['.ts', '.js']
  },
  module: {
    rules: [
      { parser: { requireEnsure: false } },
      {
        test: /\.(js|ts)$/,
        enforce: 'pre',
        loader: 'tslint-loader',
        include: srcDir
      },
      {
        test: /\.(js|ts)$/,
        loader: 'awesome-typescript-loader',
        include: srcDir
      },
      {
        exclude: [
          /\.(js|ts)$/
        ],
        loader: 'file-loader',
        options: {
          name: '[name].[ext]'
        }
      }
    ]
  },
  plugins: [
    new CheckerPlugin(),
    new webpack.optimize.CommonsChunkPlugin({
      name: 'vendor',
      minChunks: (module) => {
        return module.context && module.context.indexOf('node_modules') !== -1;
      }
    })
  ]
}

Acest lucru produce, din păcate, următorul rezultat:

• construire/

  • vendor.js
  • main.js