2015-02-08 71 views
0

我剛剛從React 0.11.1升級到0.12.2。到目前爲止,我的代碼結構是這樣的,所以我的組件在他們自己的目錄中,我會使用Grunt將它們編譯爲一個javascript目錄,然後將它與React.js連接成一個文件以用於index.html。構建React 0.12項目的正確方法是什麼?

Project 
    |_index.html 
    | JSX 
     |_someFile.jsx 
    | JS 
     |_somefile.js 
     | Lib 
      |_react.js 
    | Production 
     |_concatenated.js 


module.exports = function (grunt) { 
    grunt.initConfig({ 
     pkg: grunt.file.readJSON('package.json'), 
     react: { 
      dynamic_mappings: { 
       files: [ 
        { 
         expand: true, 
         cwd: 'jsx/', 
         src: ['*/*.jsx', '*.jsx'], 
         dest: 'js/', 
         ext: '.js' 
       } 
       ] 
      } 
     }, 
     concat: { 
      dist: { 
       src: ['js/lib/*.js', 'js/*/*.js'], 
       dest: 'prod/built.js' 
      } 
     }, 
    ... 
    }); 
}; 

有一次,我升級反應0.12.2我得到的消息「Warning: Something is calling a React component directly. Use a factory or JSX instead. See: h[ttp://fb.me/react-legacyfactory][1]」的代碼會的工作,但很明顯,我使用一些舊的約定。我讀react-legacyfactory和新的documentation,它看起來像我所要做的只是添加要求的項目,並呼籲var React = require('react'); 我這樣做,我甚至添加了反應和反應到我的package.json以防萬一,但現在我得到「Uncaught Error: Module name "react" has not been loaded yet for context: _. Use require([])」我對require的要求還不太熟悉,或者現在正在構建React。連接所有的JS文件是否與React項目現在應該如何工作相矛盾?

+0

該錯誤看起來像您可能正在使用require.js,但browserify是模塊加載反應的推薦工具。它還會處理將所有文件連接成一個包。 – 2015-02-09 02:30:47

回答

0

您使用的是什麼版本的grunt-react?我相信如果您在頁面中使用最新版本的反應,但是您使用舊版本的react-tools編譯了您的jsx,則會發生此錯誤。

+0

運行'npm update'和'npm -v grunt-react'之後,我有版本1.4.14我還將package.json中的所有內容都設置爲使用「*」使其保持最新,但看起來並不像它是固定的我的問題。 – EasilyBaffled 2015-02-08 23:24:17

+0

'npm -v'實際上只是返回npm的版本。如果您運行'npm list react-tools',您是否至少安裝了0.12.0? – 2015-02-08 23:56:18

+0

| [email protected] | _ [email protected] | [email protected] extraneous | _ [email protected] | [email protected]無效 – EasilyBaffled 2015-02-09 00:15:20

相關問題