webpack: Problem with 'text' require.js plugin

Hello!

I have a big problem when try migrate from require.js to webpack. my config:

var path = require("path");
var webpack = require("webpack");
var appModulesPath = path.join(path.resolve('public/app/js'));
var libsPath = path.join(path.resolve('public/app/lib'));
module.exports = {
  cache: true,
  context: appModulesPath,
  entry: {
      entryMain: './main',
      // entryLogin: 'main-login'
  },
  output: {
    path: path.join(__dirname, "dist"),
    publicPath: "dist",
    filename: "[name].js",
    chunkFilename: "[chunkhash].js"
  },
  module: {
    loaders: [
      { test: /require\.js$/, loader: "exports?requirejs!script" },
      { test: /text!\.html$/, loader: "html" }
    ]
  },
  externals: {
    // require("jquery") is external and available
    //  on the global var jQuery
  },
  resolve: {
    root: [appModulesPath, libsPath],
    alias: {
        "text": 'text.js',
        "angular": 'angular/angular.js',
        "angularRoute": 'angular-route/angular-route.js',
        "angularCookies": 'angular-cookies/angular-cookies.js',
        "angularMocks": 'angular-mocks/angular-mocks.js',
        "jquery": 'jquery.js',
        "wysihtml5": 'wysihtml5.js',
        "gritter": 'jquery.gritter.js',
        "icheck": 'jquery.icheck.js',
        "placeholder": 'jquery.placeholder.js',
        "qtip": 'jquery.qtip.js',
        "tooltipster": 'jquery.tooltipster.min.js',
        "almond": 'almond/almond.js',
        "cryptojs": 'cryptojs/hmac-sha1.js',
        "datepicker": 'bootstrap-datepicker.js',
        "slider": 'jquery-ui-slider.js',
        "select2": 'select2.js',
        "toastr": 'toastr.js',
        "requirejs": 'requirejs/require.js'
    }
  },
  plugins: [
    new webpack.ProvidePlugin({
      // Automtically detect jQuery and $ as free var in modules
      // and inject the jquery library
      // This is required by many jquery plugins
      jQuery: "jquery",
      $: "jquery"
    })
  ]
};

Then, i use for require html => require.js text plugin.

when i run webpack:

ERROR in ./servers/partition-modal.js
Module not found: Error: Cannot resolve module 'text' in /private/var/www/webzilla/ssp/public/app/js/servers
 @ ./servers/partition-modal.js 3:0-173:2

example file:

'use strict';

define([
    'app',
    'text!servers/tpl/cart.html'
], function(
    app,
    tpl
) {
    app.controller('CartCtrl', [
        '$scope',
        '$location',
    function(
        $scope,
        $location
    ){
    }]);
});

What i do wrong?

About this issue

  • Original URL
  • State: closed
  • Created 9 years ago
  • Comments: 15 (5 by maintainers)

Most upvoted comments

@SimenB, one possible reason for preserving the text and other Require.js plugins (and syntax): ease legacy transitions to webpack. I’m currently migrating a large project, and I’m trying to be minimally invasive wherever possible.

I know its been awhile on this thread but came across this problem when I was trying to integrate Webpack 2 as our new bundler. Anyways here is my solution following @sokra advice.

webpack.config.js

resolveLoader: {
  alias: {
      text: 'text-loader'
  }
}

Also going to need text-loader.

What if the requirejs plugin is written by myself? Should I write a webpack loader again?