javascript - 在 webpack 中安装 CoffeeScript 库

Question

我正在使用 React 和 webpack 构建一个应用程序。我想包含一个似乎使用 CoffeeScript 构建的库(在此 example psd 中)。

但是当我运行 webpack 时，出现以下错误:

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

我尝试添加 coffee-loader 但错误消息仍然存在。

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

有什么想法可以解决这个问题吗？

Answer 1

你可以尝试在你的react类中使用require，

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

并在 webpack 配置中使用 json-loader。

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