webpack 加载 tpl 资源的问题?


用 webpack 加载 tpl 模板资源


 {test: /\.(tpl|ejs)$/, loader: 'ejs'}

tpl 里面是这样的


 // a.tpl
<div class="widget">
  <div class="widget-title"></div>
</div>

入口


 // 希望得到的是字符串 '<div class="widget"><div class="widget-title"></div></div>'
var tpl = require('./a.tpl');

报错:Error in loader: didn't return a function.

请问: tpl 要怎么写? 还是 loader 不是用 ejs ?

webpack

kkkkuso 9 years, 3 months ago

按照你的做法没有错啊?我是这样试的:

a.tpl


 <div class="widget">
  <div class="widget-title"></div>
</div>

webpack.config.js


 'use strict';

var path = require('path');
var webpack = require('webpack');

module.exports = {
    entry: {
        index: './index.js'
    },
    output: {
        path: path.resolve(__dirname, 'build'),
        filename: '[name].bundle.js',
        chunkFilename: '[id].bundle.js'
    },
    module: {
        loaders: [
            {
                test: /\.js$/,
                loader: 'babel'
            },
            {
                test: /\.(tpl|ejs)$/,
                loader: 'ejs'
            }
        ]
    }
};

index.js


 var tpl = require('./a.tpl');

console.log(tpl());//<div class="widget"><div class="widget-title"></div></div>

require('./a.tpl') 返回的是一个 compiled template function , 执行一下这个 function 就好了

你是 ejs-loader 报的错?

大松井玲奈 answered 9 years, 3 months ago

Your Answer