webpack: Template cannot be applied as TemplateArgument: HarmonyImportDependency

I can’t understand what it means. It’s a bug? Maybe, I doing something wrong?

error stack:

vendor.js
Template cannot be applied as TemplateArgument: HarmonyImportDependency
Error: Template cannot be applied as TemplateArgument: HarmonyImportDependency
    at TemplateArgumentDependencyTemplate.TemplateArgumentDependency.Template.apply (/home/mixtape/web/repo/gmail/node_modules/webpack/
lib/dependencies/TemplateArgumentDependency.js:24:46)
    at doDep (/home/mixtape/web/repo/gmail/node_modules/webpack/lib/NormalModule.js:227:12)
    at Array.forEach (native)
    at doBlock (/home/mixtape/web/repo/gmail/node_modules/webpack/lib/NormalModule.js:243:22)
    at NormalModule.source (/home/mixtape/web/repo/gmail/node_modules/webpack/lib/NormalModule.js:278:2)
    at ModuleTemplate.render (/home/mixtape/web/repo/gmail/node_modules/webpack/lib/ModuleTemplate.js:15:28)
    at ChunkTemplate.Template.renderChunkModules (/home/mixtape/web/repo/gmail/node_modules/webpack/lib/Template.js:115:31)

    at ChunkTemplate.render (/home/mixtape/web/repo/gmail/node_modules/webpack/lib/ChunkTemplate.js:18:21)
    at Compilation.createChunkAssets (/home/mixtape/web/repo/gmail/node_modules/webpack/lib/Compilation.js:847:34)
    at Compilation.<anonymous> (/home/mixtape/web/repo/gmail/node_modules/webpack/lib/Compilation.js:556:9)

my env: linux debian nodejs 5.11.0 webpack 2.1.0-beta.8

my webpack config:

"use strict";

const path     = require("path");
const webpack  = require("webpack");
const aprefix  = require("autoprefixer");
const annotate = require("ng-annotate-webpack-plugin");
const isDev    = require("./environments").isDev;
const isWatch  = require("./environments").isWatch;

module.exports = function(root) {

  let options = {
    watch: isWatch,
    context: root,
    entry: {
      app: ["./client/js/index.js"],
      vendor: ["angular"]
    },
    output: {
      path: path.join(root, "./server/public/assets/js/"),
      filename: "[name].js",
      chunkFilename: "[id].js",
      publicPath: "",
      pathinfo: isDev
    },
    debug: isWatch,
    devtool: isWatch ? "#inline-source-map" : null,
    resolve: {
      modules: [root, "node_modules"],
      extensions: [".js"],
      enforceModuleExtension: false,
      enforceExtension: false,
      mainFields: ["main"],
      descriptionFiles: ["package.json"]
    },
    resolveLoader: {
      modulesDirectories: ["node_modules"],
      extensions: ["", ".loader.js", ".js"],
      moduleTemplates: ["*-loader", "*"]
    },
    plugins: [
      new webpack.NoErrorsPlugin(),
      new webpack.optimize.CommonsChunkPlugin({
        name: "vendor",
        minChunks: Infinity
      })
    ],
    module: {
      loaders: [{
        test: /\.js$/,
        loader: "babel-loader",
        include: [
          path.join(root, "./client")
        ],
        query: {
          presets: ["es2015-webpack"]
        }
      }, {
        test: /\.html$/,
        loader: "html-loader",
        include: [
          path.join(root, "./client")
        ],
        query: {
          attrs: false
        }
      }, {
        test: /\.styl$/,
        loader: isDev ? "style-loader!css-loader!postcss-loader!stylus-loader?resolve url"
                      : "style-loader!css-loader?minimize!postcss-loader!stylus-loader?resolve url"
      }, {
        test: /\.svg$/,
        loader: "svg-url-loader!svgo-loader"
      }],
      noParse: [
        /angular\/angular.js/
      ]
    },
    postcss: function () {
      return [aprefix({
        browsers: ["last 2 versions", "Firefox ESR", "ie >= 9"]
      })];
    }
  };

  if (!isDev) {
    options.plugins.push(
      new webpack.optimize.UglifyJsPlugin({
        compress: {
          "warnings": false,
          "drop_debugger": true,
          "drop_console" : true,
          "unsafe": true
        }
      }),
      new annotate()
    );
  }

  if (!isWatch) {
    options.plugins.push(
      new webpack.optimize.DedupePlugin()
    );
  }

  return options;
};

About this issue

  • Original URL
  • State: closed
  • Created 8 years ago
  • Comments: 18 (6 by maintainers)

Commits related to this issue

Most upvoted comments

The template for the DedupePlugin is missing for harmony imports. As workaround disable the DedupePlugin.

You can’t use the DedupePlugin with wbepack2 and Angular 2 until https://github.com/webpack/webpack/issues/2644 is solved.

Yes dedupe well be removed for v2 we believe. For now, remove DedupePlugin. Tree-shaking should help mitigate this.

@CumpsD oh, I wrongly assumed that I have nothing to do to enable tree shaking but all examples I found uses babel 😦 So good question!

I’ve read that, but how to set it up? 😃 Everything I search needs babel, which isn’t in our project. That’s why I was looking for some info

Is there some info out there on how to setup treeshaking with webpack2? (without babel?)

@sokra I saw this marked ready like it’s already completed have you just yet to push and cut a release for it?