erfordern ('template.jade') in reagieren-Starter-Kit

Question

Kann mir jemand vielleicht erklären, wie dieser Build-Zeit require funktioniert?

https://github.com/kriasoft/react-starter-kit/blob/feature/redux/src/server.js#L89

Sie fordern eine jade Vorlage, die Verpackung oder die Konfiguration dies erlaubt, scheine ich nicht in der Lage, es selbst zu finden.

const template = require('./views/index.jade') 

ich denke, ist viel eleganter dann:

import jade from 'jade' 
const template = jade.compile('./views/index.jade') 

Answer 1

Als RGraham mentioned in his comment, die require Anruf „abgefangen“ ist während webpack wird Kompilierung des Anwendungspaket. Dies geschieht mit Hilfe "loaders" durchgeführt, die für die Einfuhr eines bestimmten Typs bestimmtes Verhalten zu definieren:

Lader können Sie Vorprozess Dateien, wie Sie benötigen() oder „Last“ sie.

In diesem speziellen Fall, der Lader, die diese Modifikation tut könnte einer von ihnen sein (oder eine andere, die ich nicht in meiner Suche gefunden):

• https://github.com/bline/jade-html-loader
• https://github.com/webpack/jade-loader

Edit: am project's own webpack configuration suchen wir es sehen kann, ist die zweite Verbindung über:

{ 
    test: /\.jade$/, 
    loader: 'jade-loader', 
} 

Answer 2

jade-loader liest den Inhalt der angegebenen Datei, die in etwa so aussehen (Jade string) machen:

h1 Hello, #{author}! 

..und ersetzt, dass mit einem Commonjs JavaScript-Code ähnlich wie diese (bei der Kompilierung):

module.exports = function(data) { 
    return `<h1>Hello, ${data.name}</h1>`; 
};