webpack阻止迁移到v1导致无法处理的情况

时间:2019-07-18 14:56:53

标签: webpack

我正在尝试更新旧的webpack配置文件。该配置是使用webpack-blocks v0.4创建的,该版本依赖于webpack2。

升级到webpack4后,我更改了导入,使其与新库匹配(我现在使用的是webpack@4.3.1和webpack-blocks@2.0.1)

这是更新的文件:

// https://github.com/diegohaz/arc/wiki/Webpack
const splitVendor = require('webpack-blocks-split-vendor')
const happypack = require('webpack-blocks-happypack')
const serverSourceMap = require('webpack-blocks-server-source-map')
const nodeExternals = require('webpack-node-externals')
const AssetsByTypePlugin = require('webpack-assets-by-type-plugin')
const ChildConfigPlugin = require('webpack-child-config-plugin')
const SpawnPlugin = require('webpack-spawn-plugin')

const webpack = require('webpack')
const {
  createConfig,

  // Feature blocks
  babel,
  devServer,

  // Shorthand setters
  addPlugins,
  defineConstants,
  group,
  entryPoint,
  env,
  setOutput,
  sourceMaps,
} = require('webpack-blocks')
const path = require('path')

// console.log(require("webpack-blocks"));

const host = process.env.HOST || 'localhost'
const port = +process.env.PORT + 1 || 3001
const sourceDir = process.env.SOURCE || 'src'
const publicPath = `/${process.env.PUBLIC_PATH || ''}/`.replace('//', '/')
const sourcePath = path.join(process.cwd(), sourceDir)
const outputPath = path.join(process.cwd(), 'dist/public')
const assetsPath = path.join(process.cwd(), 'dist/assets.json')
const clientEntryPath = path.join(sourcePath, 'client.js')
const serverEntryPath = path.join(sourcePath, 'server.js')
const devDomain = `http://${host}:${port}/`

const assets = () => () => ({
  module: {
    rules: [
      {
        test: /\.(png|jpe?g|svg|woff2?|ttf|eot)$/,
        loader: 'url-loader?limit=8000',
      },
    ],
  },
})


const resolveModules = modules => () => ({
  resolve: {
    modules: [].concat(modules, ['node_modules']),
  },
})

const base = () =>
  group([
    setOutput({
      filename: '[name].js',
      path: outputPath,
      publicPath,
    }),
    defineConstants({
      'process.env.NODE_ENV': process.env.NODE_ENV,
      'process.env.PUBLIC_PATH': publicPath.replace(/\/$/, ''),
    }),
    addPlugins([new webpack.ProgressPlugin()]),
    happypack([babel()]),
    assets(),
    resolveModules(sourceDir),

    env('development', [
      setOutput({
        publicPath: devDomain,
      }),
    ]),
  ])

const server = createConfig([
  base(),
  entryPoint({ server: serverEntryPath }),
  setOutput({
    filename: '../[name].js',
    libraryTarget: 'commonjs2',
  }),
  addPlugins([
    new webpack.BannerPlugin({
      banner: 'global.assets = require("./assets.json");',
      raw: true,
    }),
  ]),
  () => ({
    target: 'node',
    externals: [nodeExternals()],
    stats: 'errors-only',
  }),

  env('development', [
    serverSourceMap(),
    addPlugins([new SpawnPlugin('npm', ['start'])]),
    () => ({
      watch: true,
    }),
  ]),
])

const client = createConfig([
  base(),
  entryPoint({ client: clientEntryPath }),
  addPlugins([
    new AssetsByTypePlugin({ path: assetsPath }),
    new ChildConfigPlugin(server),
  ]),

  env('development', [
    devServer({
      contentBase: 'public',
      stats: 'errors-only',
      historyApiFallback: { index: publicPath },
      headers: { 'Access-Control-Allow-Origin': '*' },
      host,
      port,
    }),
    sourceMaps(),
    addPlugins([new webpack.NamedModulesPlugin()]),
  ]),

  env('production', [
    splitVendor(),
    addPlugins([
      new webpack.optimize.UglifyJsPlugin({ compress: { warnings: false } }),
    ]),
  ]),
])

module.exports = client

现在不幸的是,这引发了一个错误:

TypeError: updateFunction is not a function
    at configSetters.reduce (/home/wolf/Desktop/Work/Job/TheShop/ecommerce-reloaded/node_modules/@webpack-blocks/webpack/node_modules/@webpack-blocks/core/lib/configSetters.js:32:12)
    at Array.reduce (<anonymous>)
    at invokeConfigSetters (/home/wolf/Desktop/Work/Job/TheShop/ecommerce-reloaded/node_modules/@webpack-blocks/webpack/node_modules/@webpack-blocks/core/lib/configSetters.js:30:24)

我不确定它是来自配置还是依赖版本不匹配。我也尝试过使用webpack-blocks存储库中的示例,但不幸的是,它还会引发错误(devServer.proxy不是函数)。

还有其他要更改的地方才能迁移吗?我敢肯定,我已按照here

指定的所有步骤进行操作

0 个答案:

没有答案