使用webpack + handlebars-loader加载Handlebars部分时出错

Question

问题

(注意:我的文件结构和webpack配置都遵循此问题的描述.)

我在labels.hdbs我的模板中使用了一个名为Handlebars的部分main.hdbs,如下所示:

<div class="panel-heading text-center">
    <div class="user-info">
        <div class="name small text-muted"><strong>{{requester.name}}</strong> ({{requester.email}})</div>
    </div>
    {{> labels requester}}
</div>

但是,当我运行webpack时,我收到以下错误:

WARNING in ./src/templates/main.hdbs
Module build failed: Error: Partial './src/templates/labels' not found

版本

• webpack:1.12.13
• 车把装载机:1.5.0
• 车把:4.0.5

文件结构

这是我的文件结构的配对描述.

.
??? dist
??? lib
??? src 
|   ??? javascripts
|   |   ??? index.js
|   ??? templates
|       ??? main.hdbs
|       ??? labels.hdbs
|       ??? helpers
??? webpack.config.js
??? node_modules
??? package.json

Webpack配置

我现在用的车把装载模块,并同时设置rootRelative和helperDirs适当的选项(我想!):

/* eslint-env node */
var path = require('path');
var webpack = require('webpack');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var extractStyles = new ExtractTextPlugin('main.css');
var HtmlWebpackPlugin = require('html-webpack-plugin');

var externalAssets = {
  css: [...],
  js: [
    'https://cdn.jsdelivr.net/g/lodash@4.14.0,handlebarsjs@4.0.5,jquery@3.1.0',
    'https://assets.zendesk.com/apps/sdk/2.0/zaf_sdk.js'
  ]
}

module.exports = {
  progress: true,
  entry: {
    app: ['./src/javascripts/index.js', './src/stylesheets/app.scss']
  },
  output: {
    path: './dist/assets',
    filename: 'main.js',
    sourceMapFilename: '[file].map'
  },
  module: {
    preLoaders: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        loader: 'eslint-loader'
      }
    ],
    loaders: [
      {
        test: /\.(gif|jpe?g|png|svg|woff2?|ttf|eot)$/,
        loader: 'url-loader?limit=10000&name=[name].[ext]'
      },
      {
        test: /\.scss$/,
        loader: extractStyles.extract("style", ["css?sourceMap&root=" + path.resolve('./dist/assets'), "sass?sourceMap"])
      },
      {
        test: /\.json$/,
        exclude: path.resolve(__dirname, './src/translations'),
        loader: 'json-loader'
      },
      {
        test: /\.json$/,
        include: path.resolve(__dirname, './src/translations'),
        loader: 'translations-loader',
        query: {
          runtime: 'handlebars'
        }
      },
      {
        test: /\.js$/,
        exclude: /node_modules/,
        loader: 'babel-loader',
        query: {
          presets: ['env'],
          plugins: ['transform-async-to-generator']
        }
      },
      {
        test: /\.(handlebars|hd?bs)$/,
        loader: 'handlebars-loader',
        query: {
          extensions: ['handlebars', 'hdbs', 'hbs'],
          runtime: 'handlebars',
          inlineRequires: '\/images\/',
          rootRelative: './src/templates/',
          helperDirs: [ 
            path.resolve(__dirname, './src/templates/helpers')
          ]
        }
      }
    ]
  },
  resolveLoader: {
    modulesDirectories: ['./lib/loaders', 'node_modules']
  },
  resolve: {
    modulesDirectories: ['node_modules', './lib/javascripts'],
    alias: {
      'app_manifest': path.join(__dirname, './dist/manifest.json')
    },
    extensions: ['', '.js']
  },
  externalAssets: externalAssets,
  externals: {
    handlebars: 'Handlebars',
    jquery: 'jQuery',
    lodash: '_',
    zendesk_app_framework_sdk: 'ZAFClient'
  },
  devtool: '#eval',
  plugins: [
    extractStyles,
    new HtmlWebpackPlugin({
      warning: 'AUTOMATICALLY GENERATED FROM ./lib/templates/layout.hdbs - DO NOT MODIFY THIS FILE DIRECTLY',
      vendorCss: externalAssets.css,
      vendorJs: externalAssets.js,
      template: '!!handlebars!./lib/templates/layout.hdbs'
    }),
    new webpack.optimize.UglifyJsPlugin({
      compress: {
        drop_debugger: false,
        warnings: false
      }
    })
  ]
};

谢谢您的帮助!