小编Ale*_*lex的帖子

我遇到了麻烦,我刚刚npm卸载react-bootstrap,然后npm install react-bootstrap,webpack再也无法加载这个模块了.

我像这样启动webpack:

/var/www/cloud/node_modules/.bin/webpack --config webpack.config.js --watch --display-error-details

这里是错误,它只是无法在react-bootstrap中找到package.json:

ERROR in ./core/static/core/js/modules/dashboard/admin/Customer.js
Module not found: Error: Cannot resolve module 'react-bootstrap' in /var/www/cloud/core/static/core/js/modules/dashboard/admin
resolve module react-bootstrap in /var/www/cloud/core/static/core/js/modules/dashboard/admin
  looking for modules in /var/www/cloud/node_modules
    resolve 'file' react-bootstrap in /var/www/cloud/node_modules
      resolve file
        /var/www/cloud/node_modules/react-bootstrap is not a file
        /var/www/cloud/node_modules/react-bootstrap.js doesn't exist
        /var/www/cloud/node_modules/react-bootstrap.jsx doesn't exist
    resolve 'file' or 'directory' /var/www/cloud/node_modules/react-bootstrap
      resolve file
        /var/www/cloud/node_modules/react-bootstrap is not a file
        /var/www/cloud/node_modules/react-bootstrap.js doesn't exist
        /var/www/cloud/node_modules/react-bootstrap.jsx doesn't exist
      resolve directory
        use lib/index.js from package.json
          resolve 'file' or 'directory' lib/index.js …

我正在使用react-bootstrap来启动模态表单.

为此,我在我调用的产品组件中创建了一个模态组件PopupForm,一个表单组件ProductForm,一个产品组件

<ModalTrigger 
    modal={<PopupForm form={<ProductForm ref="pform" data={this.props.prod_data} />}/>}>
       <Button bsStyle='primary' bsSize='small' style={{marginRight:'5px'}} >
            <span className="glyphicon glyphicon-pencil" />
       </Button>
</ModalTrigger>

PopupForm:

var PopupForm = React.createClass({
    render: function(){
        return (
            <Modal {...this.props} bsStyle='primary' 
                   style={{width:200}} title='Edition' animation={false}>
            <div className='modal-body'>
                {this.props.form}
            </div>
            <div className='modal-footer'>
              <Button onClick={this.props.form.submit()}>Editer</Button>
              <Button onClick={this.props.onRequestHide}>Close</Button>
            </div>
          </Modal>
        )
    }
});

在此onClickEditer,我想调用的方法submit中的ProductForm组成部分,该ProductForm部分被发送到PopupForm的道具的形式,我展示它是这样{this.props.form},但我不能调用该方法{this.props.form.submit()} 其实我想使用的模式按钮如果不可能触发ProductForm方法,我将在ProductForm中使用提交按钮.

这是我的ProductForm:

var ProductForm = React.createClass({

    componentDidMount: function() {
        this.props.submit …

我使用的是Django 1.9，React和webpack，我使用外部工具在javascript文件中加载Django I18n函数，例如gettext。

从视图中这样加载：

<script type="text/javascript" src="{% url 'django.views.i18n.javascript_catalog' %}/0"></script>

这是我的webpack配置：

externals: {
    // require("jquery") is external and available
    //  on the global var jQuery
    "jquery": "jQuery",
    "utils": "utils",
    "gettext":"gettext",
    "django":"django",//I18n functions are encapsulated in the django object

    },

在我的jsx文件中，我像这样加载gettext：

从'django'导入{gettext，interpolate，ngettext}

render(){
var login_header_text = gettext("blablabla.");
....

实际上几乎所有东西都可以使用，当我使用django-admin makemessages -d djangojs -l时，它会恢复许多gettext，但是脚本会忽略某些gettext，因此有时我必须将gettext放在渲染函数的开头，然后它才能工作。 ..，我不知道为什么会这样。

最后，我的技术可以使它完全起作用，但是也许我做错了。也许我应该用grunt生成mo文件，并用webpack用po loader动态加载它，因为我需要尽快将它们动态加载到页面中。

也许您可以指导我一些？谢谢