Question

当我在开发模式下使用 Webpack 编译javascript时，它在 Android 设备上不起作用，而在其他地方都可以正常工作。当我以生产模式进行编译时，它也可以在 Android 上运行。谁能说出为什么呢？如果由于缩小而使某些内容中断，那会更有意义，但是对我来说，这是如此奇怪，以至于在缩小的代码有效的同时，美化的代码无法正常工作。

更新：“不起作用”是指没有一行代码在运行。没有一个单独的“ console.log（）”，“ alert（）”或其他任何东西。我没有收到任何错误，因为它在Android以外的任何地方都可以正常工作。我正在使用testingbot.com在android上进行测试，因此我没有调试控制台，这使我非常盲目。我还尝试将所有代码和依赖项简化为仅jquery，但是即使在这种情况下，当代码以开发模式编译时，在android上也没有任何作用。

我的配置文件：

module.exports = {
   entry: entry,
   output: {
    path: path.resolve(__dirname+'/public/dist', 'js'),
    filename: '[name]-min.js'
  },
  mode:'production',
  optimization:{
    minimizer:minimizer
  },
  plugins: plugins,
  module:{
    rules: rules
  },
}

最小化器对象：

module.exports = [
  new TerserPlugin(),
  new OptimizeCssAssetsPlugin({})
]

插件：

module.exports = [
  new webpack.ProvidePlugin({
    $: "jquery",
    jQuery: "jquery",
    jquery: "jquery",
    "window.jQuery": "jquery",
    "window.$": "jquery",
    swal: "sweetalert2/dist/sweetalert2.js"
  }),
  new MiniCssExtractPlugin({
    filename: "../css/[name].css",
    chunkFilename: "[id].css"
  }),
  new WriteToFilePlugin({
    filename: path.resolve(__dirname + '/../../src', 'assetVersion.js'),
    data: 'module.exports = ' + Number(assetVersion + 1)
  }),
  new HardSourceWebpackPlugin(),
]

规则：

module.exports = [{
    test: /\.(sa|sc|c)ss$/,
    use: [
      { loader: MiniCssExtractPlugin.loader },
      { loader: 'css-loader' },
      {
        loader: 'postcss-loader', // Run postcss actions
        options: {
          plugins: function() { // postcss plugins, can be exported to postcss.config.js
            return [
              require('autoprefixer')
            ];
          }
        }
      },
      { loader: 'sass-loader' },
    ],
  },
  {
    test: /\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
    use: [{
      loader: 'file-loader',
      options: {
        name: '[name].[ext]',
        outputPath: '../../fonts/',
        publicPath: '/fonts'
      }
    }]
  },
  {
    test: /\.m?js$/,
    exclude: /(node_modules|bower_components)/,
    use: {
      loader: 'babel-loader',
      options: {
        presets: ['@babel/preset-env'],
        plugins: ['transform-es2015-arrow-functions']
      }
    }
  }
]

Webpack编译的javascript在开发模式下无法在android上运行

0 个答案: