2017-05-02 2 views
0

htmlメイクを構築しようとしています。Lantvel Mixとアンダースコアテンプレートローダーを統合しました

リソース/資産/ htmlSrc/example.html

<html lang="en"> 
<body> 
    <%= "test" %> 
    @require('partial/header.html') 
    <div>Body</div> 
</body> 
</html> 

リソース/資産/ htmlSrc /部分/ header.html

<div>test header</div> 

私たちの私たちは、次のファイルを持っていますwebpack.mix.js

const {mix} = require('laravel-mix'); 

var HtmlWebpackPlugin = require('html-webpack-plugin') 
var CleanWebpackPlugin = require('clean-webpack-plugin') 
var path = require('path') 

mix.js('resources/assets/js/app.js', 'public/js') 
    .sass('resources/assets/sass/app.scss', 'public/css') 
    .browserSync('http://myhost'); 

webpackConfig = { 
    module: { 
     loaders: [ 
      { 
       test: /\.html$/, 
       loader: 'underscore-template-loader' 
      } 
     ] 
    }, 
    plugins: [ 
     new CleanWebpackPlugin(path.join(__dirname, 'resources/assets/htmlResult')) 
    ] 
}; 

/** 
* Mackup rendering 
*/ 
webpackConfig.plugins.push(new HtmlWebpackPlugin({ 
    filename: path.join(__dirname, 'resources/assets/htmlResult/example.html'), 
    template: './resources/assets/htmlSrc/example.html' 
})); 

mix.webpackConfig(webpackConfig); 

しかし、結果ファイルリソース/資産/ htmlResult/example.html:予想通りはないに見えます:セクションloadersはスキップされたよう

<html lang="en"><head><link href="/css/app.css" rel="stylesheet"></head> 
<body> 
    <%= "test" %> 
    @require('partial/header.html') 
    <div>Body</div> 
<script type="text/javascript" src="/js/app.js"></script></body> 
</html> 

が見えます。なにが問題ですか?代わりにloadersrulesを使用して

答えて

0

作品:

webpackConfig = { 
    module: { 
     rules: [ 
      { 
       test: /\.html$/, 
       loader: 'underscore-template-loader' 
      } 
     ] 
    }, 
    plugins: [ 
     new CleanWebpackPlugin(path.join(__dirname, 'resources/assets/htmlResult')) 
    ] 
}; 
関連する問題