在Edge浏览器中使用webpack的Angular2应用程序非常慢

时间:2017-09-13 19:50:36

标签: angular webpack microsoft-edge

我的angular2应用程序在边缘浏览器中非常慢。 Chrome和Firefox的速度相对较快。当我启用生产模式时,它在Edge中要快得多,但是有任何解决方法而不是使用生产模式。我认为它与“样式加载器”有关。有什么建议?我两天以来一直试图解决这个问题。

我的webpack.config文件

    var webpack = require('webpack');
    var HtmlWebpackPlugin = require('html-webpack-plugin');
    var ExtractTextPlugin = require('extract-text-webpack-plugin');
    var helpers = require('./helpers');

    module.exports = {
       entry: {
          'polyfills': './src/polyfills.ts',
      'vendor': './src/vendor.ts',
      'app': './src/main.ts'
   },
   // resolves extensionless files by looking for matching files with .ts or .js extensions
   resolve: {
      extensions: ['.ts', '.js']
   },

   module: {
      rules: [
         {
            test: /\.ts$/,
            use: [
               {
                  loader: 'awesome-typescript-loader',
                  options: { configFileName: helpers.root('tsconfig.json') }
               },
               'angular2-template-loader'
            ]
         },
         {
            test: /\.html$/,
            use: 'html-loader'
         },
         {
            test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,
            use: 'file-loader?name=assets/[name].[hash].[ext]'
         },
         {
            test: /\.css$/,
            exclude: helpers.root('src', 'app'),
            use: ExtractTextPlugin.extract({ fallback: 'style-loader', use: 'css-loader?sourceMap' })
         },
         {
            test: /\.css$/,
            include: helpers.root('src', 'app'),
            loader: 'raw-loader'
         },
         {
            test: /\.scss$/,
            use: [
               {
                  loader: "style-loader" // creates style nodes from JS strings
               },
               {
                  loader: "css-loader?sourceMap" // translates CSS into CommonJS
               },
               {
                  loader: "sass-loader?sourceMap" // compiles Sass to CSS
               }
            ]
         }
      ]
   },

   plugins: [
      // Workaround for angular/angular#11580
      new webpack.ContextReplacementPlugin(
         // The (\\|\/) piece accounts for path separators in *nix and Windows
         /angular(\\|\/)core(\\|\/)@angular/,
         helpers.root('./src'), // location of your src
         {} // a map of your routes
      ),

      new webpack.optimize.CommonsChunkPlugin({
         name: ['app', 'vendor', 'polyfills']
      }),

      new HtmlWebpackPlugin({
         template: 'src/index.html'
      }),

      new webpack.ProvidePlugin({
         "window.jQuery": "jquery",
         $: "jquery",
         "jQuery": "jquery",
         "Chart": "chart.js"
      }),
   ]
};

0 个答案:

没有答案