2016-05-31 11 views
1

Ich versuche, eine einfache Verwendung von machen - grunt-include-source aber ich weiß nicht Erfolg -Grunzen-include-Quelle funktioniert nicht

Mein Gruntfile ist -

module.exports = function (grunt) { 
    grunt.initConfig({ 
     includeSource: { 
     options: { 
      basePath: 'app/file1.js' 
     }, 
     myTarget: { 
      files: { 
      'dist/index.html': 'app/index.html' 
      } 
     } 
     } 
    }); 
    grunt.loadNpmTasks('grunt-include-source'); 
    grunt.registerTask('serve', function (target) { 
     grunt.task.run('includeSource'); 
    }); 
} 

Die index.html ist -

<html> 
<head> 
</head> 
<body> 
    <!-- include: "type": "js", "files": "scripts/*.js" --> 
</body> 
</html> 

Mein Ordner-Hierarchie ist -

Gruntfile.js 
app > 
    file1.js 
    index.html 
dist > 
    index.html 

Ich betreibe grunt serve und die Ausgabe im dist>index.html Ordner erhalten -

<html> 
<head> 
</head> 
<body> 

</body> 
</html> 

Ohne die erwartete - <script src="scripts/file1.js"></script>

ich wie in der documentation und in diesem question,

Warum ich don folgen gehalten bekomme nicht die erwartete Ausgabe?

+0

Könnten Sie Ihre vollständige gruntfile Post –

+0

Dies ist die gesamte Datei – URL87

Antwort

2

Sie haben zwei Probleme mit Ihrem Code, zuerst in gruntfile geben Sie einen falschen Pfad an, in Ihrem HTML geben Sie eine falsche Quelle an.

die durch Teile Lassen Sie gehen, auf Ihrem gruntfile haben Sie dies:

... 
    includeSource: { 
    options: { 
     basePath: 'app/file1.js' 
    }, 
... 

Die basepath Option auf der docs sagt:

Typ: String oder Array [Zeichenfolge] Standardwert: ''

Der Basispfad zum Erweitern von Dateien. Kann ein Array zur Unterstützung von Dateien aus mehreren Pfaden erweitern.

Dies ermöglicht es uns, einen oder mehrere Pfade als Basispfad für unsere Skripts zu verwenden. Also lassen Sie uns unsere basePath zu basePath: 'app' ändern, unsere Gruntfile.js wird wie folgt aussehen:

module.exports = function (grunt) { 
    grunt.initConfig({ 
    includeSource: { 
     options: { 
     basePath: 'app' 
     }, 
     myTarget: { 
     files: { 
      'dist/index.html': 'app/index.html' 
     } 
     } 
    } 
    }); 
    grunt.loadNpmTasks('grunt-include-source'); 
    grunt.registerTask('serve', function (target) { 
    grunt.task.run('includeSource'); 
    }); 
}; 

Wenn wir nun grunt serve laufen wird es nicht funktionieren, warum? Nun, da auf Ihrem index.html Sie haben dies:

<!-- include: "type": "js", "files": "scripts/*.js" --> 

Was bedeutet, legen Sie Script-Tags für alle JavaScript-Dateien, in den Skripte Ordner, aber wir haben keine Skripte Ordner, so dass deshalb Ihre ist leer. Lassen Sie uns unsere index.html Um dies zu ändern:

<!-- include: "type": "js", "files": "*.js" --> 

Run grunt serve et voilà Ihr Index.html hat sich geändert:

<html> 
<head> 
</head> 
<body> 
    <script src="file1.js"></script> 
</body> 
</html> 

Jetzt einfach file1.js von app/ zu dist/ kopieren haben

+0

Dennoch gibt es eine Option, eine bestimmte js, um anzuzeigen, Datei ? – URL87

+0

@ URL87 Sie könnten Ihre Datei index.html in '' –

Verwandte Themen