Installieren einer Kaffee-Skriptbibliothek in Webpack

Question

Ich baue eine App mit React & Webpack. Ich möchte eine Bibliothek einschließen, die mit Hilfe von Kaffee-Skript (in diesem example psd) erstellt zu werden scheint.

Aber wenn ich webpack laufen lasse, erhalte ich folgende Fehler:

WARNING in ./~/coffee-script/lib/coffee-script/register.js 
require.extensions is not supported by webpack. Use a loader instead. 

WARNING in ./~/coffee-script/lib/coffee-script/register.js 
require.extensions is not supported by webpack. Use a loader instead. 

WARNING in ./~/rsvp/dist/rsvp.js 
Module not found: Error: Cannot resolve module 'vertx' in /node_modules/rsvp/dist 
@ ./~/rsvp/dist/rsvp.js 1210:20-30 

WARNING in ./~/coffee-script/lib/coffee-script/coffee-script.js 
require.extensions is not supported by webpack. Use a loader instead. 

WARNING in ./~/coffee-script/lib/coffee-script/coffee-script.js 
Critical dependencies: 
157:43-50 require function is used in a way in which dependencies cannot be statically extracted 
161:26-33 require function is used in a way in which dependencies cannot be statically extracted 
@ ./~/coffee-script/lib/coffee-script/coffee-script.js 157:43-50 161:26-33 

WARNING in ./~/coffee-script/lib/coffee-script/browser.js 
Critical dependencies: 
8:25-32 require function is used in a way in which dependencies cannot be statically extracted 
@ ./~/coffee-script/lib/coffee-script/browser.js 8:25-32 

ERROR in ./~/coffee-script/bin/coffee 
Module parse failed: /node_modules/coffee-script/bin/coffee Unexpected character '#' (1:0) 
You may need an appropriate loader to handle this file type. 
SyntaxError: Unexpected character '#' (1:0) 
    at Parser.pp$4.raise (/node_modules/webpack/node_modules/acorn/dist/acorn.js:2221:15) 
    at Parser.pp$7.getTokenFromCode (/node_modules/webpack/node_modules/acorn/dist/acorn.js:2756:10) 
    at Parser.pp$7.readToken (/node_modules/webpack/node_modules/acorn/dist/acorn.js:2477:17) 
    at Parser.pp$7.nextToken (/node_modules/webpack/node_modules/acorn/dist/acorn.js:2468:15) 
    at Parser.parse (/node_modules/webpack/node_modules/acorn/dist/acorn.js:515:10) 
    at Object.parse (/node_modules/webpack/node_modules/acorn/dist/acorn.js:3098:39) 
    at Parser.parse (/node_modules/webpack/lib/Parser.js:902:15) 
    at NormalModule.<anonymous> (/node_modules/webpack/lib/NormalModule.js:104:16) 
    at NormalModule.onModuleBuild (/node_modules/webpack-core/lib/NormalModuleMixin.js:310:10) 
    at nextLoader (/node_modules/webpack-core/lib/NormalModuleMixin.js:275:25) 
    at /node_modules/webpack-core/lib/NormalModuleMixin.js:259:5 
    at Storage.finished (/node_modules/webpack/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:38:16) 
    at /node_modules/graceful-fs/graceful-fs.js:78:16 
    at FSReqWrap.readFileAfterClose [as oncomplete] (fs.js:415:3) 

@ ./~/coffee-script/lib/coffee-script/register.js 52:13-48 

ERROR in ./~/coffee-script/lib/coffee-script/grammar.js 
Module not found: Error: Cannot resolve module 'jison' in /node_modules/coffee-script/lib/coffee-script 
@ ./~/coffee-script/lib/coffee-script/grammar.js 5:11-27 

Ich habe versucht, das Hinzufügen einer coffee-loader aber die Fehlermeldung noch vorhanden ist.

{ 
    test: /\.coffee$/, 
    loader: "coffee-loader" 
} 

Irgendwelche Ideen, wie man dieses Problem beheben kann?

Answer 1

u versuchen kann, erfordern die Verwendung in Ihrer Klasse reagieren,

const PSD = require('psd/lib/psd.coffee'); 

und verwenden json-loader in Ihrem webpack Config.

{ test: /\.coffee$/, loader: 'coffee-loader' }, 
{ test: /\.(coffee\.md|litcoffee)$/, loader: 'coffee-loader?literate' }, 
{ test: /\.json$/, loader: 'json-loader' },