Browserify Error: Parsing file, Unexpected token
Browserify Error: Parsing file, Unexpected token
我正在尝试将此 npm module 与 browserify 一起使用。
当我 运行 $ browserify build/widget.js -o bundle.js
时,我收到以下错误:
Error: Parsing file /Users/nir/browsewidget/node_modules/react-spin/src/main.js: Unexpected token (29:6)
at Deps.parseDeps (/usr/local/lib/node_modules/browserify/node_modules/module-deps/index.js:436:28)
at fromSource (/usr/local/lib/node_modules/browserify/node_modules/module-deps/index.js:375:44)
at /usr/local/lib/node_modules/browserify/node_modules/module-deps/index.js:369:17
at ConcatStream.<anonymous> (/usr/local/lib/node_modules/browserify/node_modules/concat-stream/index.js:36:43)
at ConcatStream.emit (events.js:129:20)
at finishMaybe (/usr/local/lib/node_modules/browserify/node_modules/readable-stream/lib/_stream_writable.js:460:14)
at endWritable (/usr/local/lib/node_modules/browserify/node_modules/readable-stream/lib/_stream_writable.js:469:3)
at ConcatStream.Writable.end (/usr/local/lib/node_modules/browserify/node_modules/readable-stream/lib/_stream_writable.js:436:5)
at DuplexWrapper.onend (/usr/local/lib/node_modules/browserify/node_modules/readable-stream/lib/_stream_readable.js:537:10)
at DuplexWrapper.g (events.js:199:16)
注意:文件 build/widget.js
不是 JSX,它是使用 JSX compiler.
构建的
为什么我会收到意外的令牌?
根据 snozza 的回答进行编辑:
我已经安装了npm install reactify --save
。
那我运行% browserify -t reactify build/widget.js
这给了 -bash: fg: %: no such job
然后我试了browserify -t reactify build/widget.js
,它给出了:
Error: Parsing file /Users/nir/browsewidget/node_modules/react-spin/src/main.js: Unexpected token (29:6)
at Deps.parseDeps (/usr/local/lib/node_modules/browserify/node_modules/module-deps/index.js:436:28)
at fromSource (/usr/local/lib/node_modules/browserify/node_modules/module-deps/index.js:375:44)
at /usr/local/lib/node_modules/browserify/node_modules/module-deps/index.js:369:17
at ConcatStream.<anonymous> (/usr/local/lib/node_modules/browserify/node_modules/concat-stream/index.js:36:43)
at ConcatStream.emit (events.js:129:20)
at finishMaybe (/usr/local/lib/node_modules/browserify/node_modules/readable-stream/lib/_stream_writable.js:460:14)
at endWritable (/usr/local/lib/node_modules/browserify/node_modules/readable-stream/lib/_stream_writable.js:469:3)
at ConcatStream.Writable.end (/usr/local/lib/node_modules/browserify/node_modules/readable-stream/lib/_stream_writable.js:436:5)
at DuplexWrapper.onend (/usr/local/lib/node_modules/browserify/node_modules/readable-stream/lib/_stream_readable.js:537:10)
at DuplexWrapper.g (events.js:199:16)
这是我 build/widget.js
要求的片段:
var React =require('react');
var Spinner = require('react-spin')
var Loading = React.createClass({displayName: "Loading",
render: function() {
var spinCfg ={
lines: 5 // The number of lines to draw
, length: 5 // The length of each line
, width: 42 // The line thickness
, radius: 21 // The radius of the inner circle
, scale: 1 // Scales overall size of the spinner
, corners: 1 // Corner roundness (0..1)
, color: '#000' // #rgb or #rrggbb or array of colors
, opacity: 0.25 // Opacity of the lines
, rotate: 0 // The rotation offset
, direction: 1 // 1: clockwise, -1: counterclockwise
, speed: 1 // Rounds per second
, trail: 60 // Afterglow percentage
, fps: 20 // Frames per second when using setTimeout() as a fallback for CSS
, zIndex: 2e9 // The z-index (defaults to 2000000000)
, className: 'spinner' // The CSS class to assign to the spinner
, top: '50%' // Top position relative to parent
, left: '50%' // Left position relative to parent
, shadow: false // Whether to render a shadow
, hwaccel: false // Whether to use hardware acceleration
, position: 'absolute' // Element positioning
};
return React.createElement(Spinner, {config: spinCfg})
}
})
//...etc...
有什么想法吗?
查看react-spin的main.js文件https://github.com/thomasboyt/react-spin/blob/master/src/main.js,确实包含JSX语法,即:
return (
<span ref="container" />
);
当 browserify 解析该文件时,这会导致解析错误。
您可以将 https://www.npmjs.com/package/reactify 等转换器与 browserify 结合使用,将 JSX 转换为普通 JS。
编辑:Reactify 示例
因为它是必需的 node_module,也需要转换,所以您需要将 browserify/reactify 转换选项添加到 react-spin
的 package.json。转到 react-spin
文件夹并将其复制到 json 包中,位于 "main"
:
下方
"browserify": {"transform": ["reactify"]},
然后再次尝试 运行 browserify 命令
我正在尝试将此 npm module 与 browserify 一起使用。
当我 运行 $ browserify build/widget.js -o bundle.js
时,我收到以下错误:
Error: Parsing file /Users/nir/browsewidget/node_modules/react-spin/src/main.js: Unexpected token (29:6)
at Deps.parseDeps (/usr/local/lib/node_modules/browserify/node_modules/module-deps/index.js:436:28)
at fromSource (/usr/local/lib/node_modules/browserify/node_modules/module-deps/index.js:375:44)
at /usr/local/lib/node_modules/browserify/node_modules/module-deps/index.js:369:17
at ConcatStream.<anonymous> (/usr/local/lib/node_modules/browserify/node_modules/concat-stream/index.js:36:43)
at ConcatStream.emit (events.js:129:20)
at finishMaybe (/usr/local/lib/node_modules/browserify/node_modules/readable-stream/lib/_stream_writable.js:460:14)
at endWritable (/usr/local/lib/node_modules/browserify/node_modules/readable-stream/lib/_stream_writable.js:469:3)
at ConcatStream.Writable.end (/usr/local/lib/node_modules/browserify/node_modules/readable-stream/lib/_stream_writable.js:436:5)
at DuplexWrapper.onend (/usr/local/lib/node_modules/browserify/node_modules/readable-stream/lib/_stream_readable.js:537:10)
at DuplexWrapper.g (events.js:199:16)
注意:文件 build/widget.js
不是 JSX,它是使用 JSX compiler.
为什么我会收到意外的令牌?
根据 snozza 的回答进行编辑:
我已经安装了npm install reactify --save
。
那我运行% browserify -t reactify build/widget.js
这给了 -bash: fg: %: no such job
然后我试了browserify -t reactify build/widget.js
,它给出了:
Error: Parsing file /Users/nir/browsewidget/node_modules/react-spin/src/main.js: Unexpected token (29:6)
at Deps.parseDeps (/usr/local/lib/node_modules/browserify/node_modules/module-deps/index.js:436:28)
at fromSource (/usr/local/lib/node_modules/browserify/node_modules/module-deps/index.js:375:44)
at /usr/local/lib/node_modules/browserify/node_modules/module-deps/index.js:369:17
at ConcatStream.<anonymous> (/usr/local/lib/node_modules/browserify/node_modules/concat-stream/index.js:36:43)
at ConcatStream.emit (events.js:129:20)
at finishMaybe (/usr/local/lib/node_modules/browserify/node_modules/readable-stream/lib/_stream_writable.js:460:14)
at endWritable (/usr/local/lib/node_modules/browserify/node_modules/readable-stream/lib/_stream_writable.js:469:3)
at ConcatStream.Writable.end (/usr/local/lib/node_modules/browserify/node_modules/readable-stream/lib/_stream_writable.js:436:5)
at DuplexWrapper.onend (/usr/local/lib/node_modules/browserify/node_modules/readable-stream/lib/_stream_readable.js:537:10)
at DuplexWrapper.g (events.js:199:16)
这是我 build/widget.js
要求的片段:
var React =require('react');
var Spinner = require('react-spin')
var Loading = React.createClass({displayName: "Loading",
render: function() {
var spinCfg ={
lines: 5 // The number of lines to draw
, length: 5 // The length of each line
, width: 42 // The line thickness
, radius: 21 // The radius of the inner circle
, scale: 1 // Scales overall size of the spinner
, corners: 1 // Corner roundness (0..1)
, color: '#000' // #rgb or #rrggbb or array of colors
, opacity: 0.25 // Opacity of the lines
, rotate: 0 // The rotation offset
, direction: 1 // 1: clockwise, -1: counterclockwise
, speed: 1 // Rounds per second
, trail: 60 // Afterglow percentage
, fps: 20 // Frames per second when using setTimeout() as a fallback for CSS
, zIndex: 2e9 // The z-index (defaults to 2000000000)
, className: 'spinner' // The CSS class to assign to the spinner
, top: '50%' // Top position relative to parent
, left: '50%' // Left position relative to parent
, shadow: false // Whether to render a shadow
, hwaccel: false // Whether to use hardware acceleration
, position: 'absolute' // Element positioning
};
return React.createElement(Spinner, {config: spinCfg})
}
})
//...etc...
有什么想法吗?
查看react-spin的main.js文件https://github.com/thomasboyt/react-spin/blob/master/src/main.js,确实包含JSX语法,即:
return (
<span ref="container" />
);
当 browserify 解析该文件时,这会导致解析错误。 您可以将 https://www.npmjs.com/package/reactify 等转换器与 browserify 结合使用,将 JSX 转换为普通 JS。
编辑:Reactify 示例
因为它是必需的 node_module,也需要转换,所以您需要将 browserify/reactify 转换选项添加到 react-spin
的 package.json。转到 react-spin
文件夹并将其复制到 json 包中,位于 "main"
:
"browserify": {"transform": ["reactify"]},
然后再次尝试 运行 browserify 命令