Compatibility problems in webpack packaging of multi-page projects built with Vue2.0

  1. use vue2.0
  2. webpack 1.13.2 package
  3. needs to be compatible with IE9

now the problem is that compatibility problems normally occur on IE10 and IE9

clipboard.png

prolify

clipboard.png

clipboard.png

Vue.js webpack
Mar.19,2021

if you are solving the problem directly, try redefining the console method.
to be thorough, find out where console is not compiled.
it is recommended to take a look at the configuration of babel.
Uh, webpack 1.13.2?
the egg hurts. This is 2.6.1
this is webpack.base.conf.js 

var path = require('path')
var utils = require('./utils')
var config = require('../config')
var vueLoaderConfig = require('./vue-loader.conf')
var webpack = require("webpack")
var ihrProject = require('../ihrProjectConfig')

function resolve(dir) {
  return path.join(__dirname, '..', dir)
}

module.exports = {
  entry: {
    app: ihrProject.main.path
  },
  output: {
    path: config.build.assetsRoot,
    filename: '[name].js',
    publicPath: process.env.NODE_ENV === 'production' ?
      config.build.assetsPublicPath : config.dev.assetsPublicPath
  },
  resolve: {
    extensions: ['.js', '.vue', '.json'],
    alias: {
      'vue$': 'vue/dist/vue.esm.js',
      '@': resolve('src'),
    }
  },
  module: {
    rules: [{
        test: /\.vue$/,
        loader: 'vue-loader',
        options: vueLoaderConfig
      },
      {
        test: /\.js$/,
        loader: 'babel-loader',
        include: [resolve('src'), resolve('test')],
        exclude: "/node_module/"
      },
      {
        test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
        loader: 'url-loader',
        query: {
          limit: 10000,
          name: utils.assetsPath('img/[name].[ext]')
        }
      },
      {
        test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
        loader: 'url-loader',
        query: {
          limit: 10000,
          name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
        }
      },
      {
        test: /\.(mp3|wav)(\?.*)?$/,
        loader: 'url-loader',
        query: {
          limit: 10000,
          name: utils.assetsPath('audio/[name].[ext]')
        }
      }

    ]
  },
  plugins: [
    new webpack.optimize.CommonsChunkPlugin('common.js'),
    new webpack.LoaderOptionsPlugin({
      options: {
        babel: {
          presets: ['es2015', "stage-2"]
        }
      }
    }),
    new webpack.ProvidePlugin({
      //wangkun
      jQuery: "jquery",
      'window.jQuery': 'jquery',
      'root.jQuery': 'jquery',
      $: "jquery"
    }),

  ]
}

this is vue-loader.conf.js 

var utils = require('./utils')
var config = require('../config')
var isProduction = process.env.NODE_ENV === 'production'

module.exports = {
  loaders: utils.cssLoaders({
    sourceMap: isProduction
      ? config.build.productionSourceMap
      : config.dev.cssSourceMap,
    extract: isProduction
  }),
  //
  transformToRequire: {
    "audio": "src"
  }
}

clipboard.png

Previous: Weex playground scan was not successful

Next: Iview TimePicker's strange question

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
© 2021 CodesHelper
Advertising Contact us About us
Menu