javascript - Browserify 找不到本地模块

Question

我有同样的问题，但与本地组件有关。

那是我的树:

app
|
 - assets
  |
   - js
    |
     - app.jsx
    |
     - MainComponent.jsx 

但是当我运行命令时:

macpro:app user$ browserify assets/js/app.jsx > tesapp.js

它响应错误:

Error: Cannot find module 'MainComponent' from '/Users/user/WebstormProjects/gowithme/app/assets/js'

这是 app.jsx 文件的代码:

var React = require('react');
var ReactDOM =  require('react-dom');
var  MainComponent  = require('MainComponent');
console.log("Test",MainComponent);

Answer 1

发生这种情况是因为您正在使用 .jsx 扩展名。默认情况下 browserify 无法识别未知扩展。将 browserifyOptions 添加到您的 grunt 配置中，它可能会有所帮助:

options: {
    transform: [['babelify', {presets: ['es2015', 'react']}]],
    browserifyOptions: {
        debug: true,
        extensions: ['.jsx']
    }
}

我还建议省略 .jsx 的使用。 <强> No .jsx extension?