Qualcuno ha esperienza o conosce buone soluzioni per raggruppare e minimizzare JavaScript modulare come RequireJS/AMD in un progetto ASP.NET MVC?Combinazione e minimizzazione di JavaScript modulare (RequireJS/AMD) con ASP.NET MVC
È il modo migliore per utilizzare il RequireJS optimizer (forse in un'azione di post-generazione?) - o c'è qualcosa di meglio là fuori per ASP.NET MVC?
Non sono sicuro se questa sia una soluzione accettabile o meno, ma Visual Studio 2012 ha un pacchetto NuGet (Microsoft.Web.Optimization) che supporta la minializzazione e il raggruppamento nativi. Io non sono sicuro se è disponibile per il 2010
E 'una riga di codice in Application_Start
Microsoft.Web.Optimization.BundleTable.Bundles.EnableDefaultBundles();
http://msdn.microsoft.com/en-us/vs11trainingcourse_aspnetandvisualstudio_topic5
Questo collegamento B/M è obsoleto. Vedi il mio tutorial B/M http://www.asp.net/mvc/tutorials/mvc-4/bundling-and-minification – RickAndMSFT
@RickAndMSFT Ah, sì, grazie. – McKay
Credo che il problema ti ha colpito è che se si è utilizzato definisce anonimi. Se si desidera un file di script combinato/bundle che contiene tutte le definisce, dovrete assegnare loro un nome.
es.
define("someModule", ["jquery", "ko"], function($,ko) { ... });
invece di
define(["jquery", "ko"], function($,ko) { ... });
Se si utilizzano i nomi di file come i nomi di modulo, sarete in grado di caricare in modo asincrono loro (non in bundle), così come precaricato (in dotazione). In questo modo puoi lavorare in modalità di debug e in modalità di rilascio senza dover modificare le tue esigenze.
Non ho esperienza con il RequireJS ottimizzatore di sapere se si prende cura di definisce anonimi o meno.
UPDATE:
Recentemente ho dovuto fare questo e uno dei problemi che ho incontrato è stato l'attributo data-principale dei require.js carico tag script. Dal momento che il file main.js aveva dipendenze dei moduli in bundle, hanno bisogno di essere caricato prima main.js ma dopo require.js. Quindi ho dovuto abbandonare data main e caricare quel file (unbundled) per ultimo.
da
<script src="../JS/require-v2.1.2.js" type="text/javascript" data-main="main.js"></script>
a
<script src="../JS/require-v2.1.2.js" type="text/javascript"></script>
<%: System.Web.Optimization.Scripts.Render("~/bundles/signup") %>
<script src="main.js" type="text/javascript"></script>
non ho guardato, ma se la configurazione fascio potrebbe garantire main.js è l'ultima, quindi non sarebbe nemmeno bisogno che lo scorso tag script.
È possibile ottenere quelle tre righe a uno utilizzando 'BundleConfig.cs', vedere la mia risposta qui sotto. Penso che i BundleTables siano nuovi in MVC 4. – zacharydl
Questi sono i passi per ottenere RequireJS bundle con main.js. Puoi scendere fino a una riga nel tag <head>. Questo non risolve il problema con le definizioni anonime.
HTML
<head runat="server">
<title></title>
<%: System.Web.Optimization.Scripts.Render("~/bundles/scripts") %>
</head>
BundleConfig.cs
using System.Web;
using System.Web.Optimization;
public class BundleConfig
{
// For more information on bundling, visit http://go.microsoft.com/fwlink/?LinkId=301862
public static void RegisterBundles(BundleCollection bundles)
{
bundles.Add(new ScriptBundle("~/bundles/scripts").Include(
"~/scripts/libs/require.js",
"~/scripts/main.js"));
}
}
principale.js devono lavorare without data-main (avevo bisogno di impostare baseurl)
require.config({
baseUrl: "scripts"
});
Tranne che non si impacchetta nient'altro che main.js e require.js, quindi qualsiasi altra dipendenza verrà caricata nello stesso modo di prima: file per file. Non è efficace, non noterai una differenza in uno scenario reale in cui hai molte dipendenze (stai salvando solo 1 carico di file). –
Nel mio scenario, questo accelera il carico iniziale di un po '. Poiché si tratta di un'applicazione a pagina singola, in realtà desidero che RequireJS carichi tutto il resto in un secondo momento, uno alla volta. – zacharydl
@myka eyl - potresti essere nel ristretto campo d'azione dell'esempio di Zach. Ma ciò che dimostra, meravigliosamente potrei aggiungere, è il modo in cui cablare richiede uno o più dei bundle specificati nella configurazione del pacchetto. Nella maggior parte dei casi ho riscontrato che creerò un pacchetto per le mie librerie esterne (jquery, knockout, ecc.) E farò riferimento a quelli in produzione tramite require. Pubblicherò un esempio qui sotto. – pimbrouwers
So che questa è una vecchia questione, ma si può dare un'occhiata a RequireJS.NET Compressor (Compressore usa YUI, non ASP.NET bundling - almeno per il momento) che fa parte del pacchetto RequireJS.NET NuGet.
Riferimenti:
Compressore - http://requirejsnet.veritech.io/compressor.html
Generale Documentazione - http://requirejsnet.veritech.io/
Github Progetto - https://github.com/vtfuture/RequireJSDotNet
Dal momento che l'approccio di AMD si basa fortemente su script caricamento di altri script , Credo che la tua migliore scommessa sia o minimizza ciascuno script indipendentemente (senza raggruppamento) o, in effetti, usa l'ottimizzatore RequireJS che prova a rilevare le inclusioni e il bundle del modulo di conseguenza. – Avish