5

I have a full aplication working with Typescript and RequireJs, it is working perfectly. I have now download WebEssentials and it is generating the minified script files. WebEssentials generates separated *.min.js files with the same name as the original script file.

How can I tell RequireJs to load my minified files instead of my original script files ?

Thanks in advance

Improve this question

3 Answers 3

Reset to default
9

You can use path config to override module paths. You can even fall back to non minified files:

requirejs.config({
    enforceDefine: true,
    paths: {
        jquery: [
            'lib/jquery.min',
            'lib/jquery'
        ]
    }
});

There may be a more general way to use min files that I don't know about!

Improve this answer
Sign up to request clarification or add additional context in comments.

2 Comments

What's the performance cost of this? Your example favors production, but, just for an example, say I use ['scriptfile', 'scriptfile.min']. 'scriptfile' is in dev but only 'scriptfile.min' is in production. How many times does RequireJS look for 'scriptfile' in production, once or on every module requirement? I assume there's a marginal bit of extra work simply because the property value is an array instead of a string.
In my informal testing, it tests these in order and is smart enough to understand that a 404 is a 404 (meaning to not look again). There is definitely a performance hit though if you are in dev but favored production, or vise versa.
9

You can create a simple customized version of require which will conditionally append '.min.js' to all module file requests that would normally just receive the '.js' appendage. Consider the following:

    //Establish a new 'useMinified' boolean in your initial config.
    require.config({ useMinified: true });

Then, edit the require.js library file and modify the 'nameToUrl' function as below:

    //Join the path parts together, then figure out if baseUrl is needed.
url = syms.join('/');

    //new statement
var extension = config.useMinified ? '.min.js' : '.js';

    //customized statement
url += (ext || (/^data\:|\?/.test(url) || skipExt ? '' : extension));

url = (url.charAt(0) === '/' || url.match(/^[\w\+\.\-]+:/) ? '' : config.baseUrl) + url;
Improve this answer

1 Comment

I just can't think of a reason why is this not implemented in requirejs yet!?
0

There isn't any magic to this. You have a few options though

  1. Use the RequireJS optimizer to generate min files for you. Very configurable.
  2. Use the --out compiler option to concatenate all your files into one and minify that
  3. Create a script/batch file to copy your app somewhere else, rename all .min.js files to .js and overwrite the non-min'd ones. Or some other mix but you get the gist
  4. Use the paths config like Steve mentioned. OK for small apps, less than ideal for large.

For the best performance you should look into the optimizer and determine if the single-script approach is the right decision or multiple smaller libraries is a better approach. I doubt that loading each .min.js file is the ideal solution for you.

Improve this answer

3 Comments

Maybe the out parameter is the best solution. I have already tested and even if I minify and explicitly load the minified file in my main page, Require will still load the verbose, or no-minified, versions of my scripts. In this case, using one file with all scripts how can I tell Require to stop loading my scripts, since everything is already loaded ?
By the way the out paramter is not working Ok. No Script was generated in the --out parameter.
If you are using AMD --out won't work for you. You'll have to use the requirejs optimizer instead.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.