2016-04-28 14 views
1

作品(WebPACKのhttp://my.safaribooksonline.com/video/web-development/9781771375887でOReillyのモジュールおよび資産バンドルから適応)以下jade webpackローダーが動作しないのはなぜですか?

const viewout = document.querySelector(".view"); 
const view = require('raw!jade-html?pretty=false!../views/index.jade'); 

viewout.innerHTML = view; 

のようなものがありますが、私は私のWebPACKの構成でヒスイを持っていると思います。だから、私はローダーアレイに以下を追加してみました:私は私にエラーを与える

const view = require('../views/index.jade'); 

に私のアプリのコードに必要と声明を変更

{ 
     test: /\.jade$/, 
     include: [ 
     Path.resolve(process.cwd(), 'client/views') 
     ], 
     loader: 'raw!jade-html?pretty=false!' 
} 

、その後を

ERROR in ./client/views/index.jade 
Module parse failed: 

つまり、元のrequireステートメントで解析して正常に動作したが、構成設定を行うとうまく動作しない - 何が間違っているのでしょうか?

+0

私はWebPACKの--watchプロセスを停止し、私が代わりにそのを取り除くためにパスが欠落してエラーが出る再起動すると、私は、以前のローダーからの相対であることを私のPath.resolveを変更する必要がありますのでパスをpath.resolve .resolve(process.cwd()、 '../views')、エラーの原因となりました./client/views/index.jade モジュールの解析に失敗しました:処理するために適切なローダーが必要な場合がありますこのファイルタイプ。 – user254694

答えて

1

これは、O'Reillyの例をインラインローダの構文から変換するために使用したwebpack.config.jsです。

const Path = require('path'); 

const config = { 
    entry: { 
    app: ['babel-polyfill','./client/js/app'] 
    }, 
    output: { 
    path: './build', 
    filename: '[name]-bundle.js' 
    }, 
    devtool: 'source-map', 
    module: { 
    loaders:[{ 
     test: /\.js$/, 
     include: [ 
     Path.resolve(process.cwd(), 'client/js') 
     ], 
     loader: 'babel', 
     query: { 
     presets: ['es2015'] 
     } 
    }, 
    { 
     test: /\.jade$/, 
     include: [ 
     Path.resolve(process.cwd(), 'client/views') 
     ], 
     loaders: ['raw', 'jade-html?pretty=true'] 
    }] 
    }, 
    resolve: { 
    extension: ['', '.js'], 
    modulesDirectories: ['node_modules'] 
    } 
}; 

module.exports = config; 
関連する問題