如何在不使用requirejs的情況下使用redux？

我試圖用終極版與reactjs和它與錯誤而失敗：如何在不使用requirejs的情況下使用redux？

Uncaught ReferenceError: require is not defined

我想包括反應和終極版是這樣的：

index.html中head標籤

<script src="https://npmcdn.com/[email protected]/dist/react-dom.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.6.16/browser.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script> 
<script src="/redux.min.js"></script> 
<script src="/react-redux.min.js"></script>

但是，當我做到這一點（從終極版網站）：

import { createStore } from 'redux';

我得到的錯誤，如果我沒有這種說法，然後我得到一個錯誤，createStore不存在，當我嘗試使用它。

如何在不使用requirejs的情況下使用redux + react？

來源

2016-08-02 Don Rhummy

'Redux.createStore' ??? ??? – webdeb

該網站正在使用ES6語法，目前尚未在主流瀏覽器中實現。您需要使用babel添加編譯步驟，該步驟會將所有javascript輸出到一個bundle.js文件中，包括您的代碼，反應，redux和所有其他依賴項。

如果您想使用react和redux，那麼瞭解如何設置工作流以使用ES6語法更有意義。你可以考慮使用創建反應的應用程序內爲基地，並從那裏添加終極版支持：

npm install -g create-react-app 
create-react-app newReduxApp 
npm install --save redux 
npm start

然後前往App.js並添加createStore。由於create-react-app爲您使用babel設置了ES6編譯，因此您將能夠使用ES6語法。

如果您不希望使用ES6語法，那麼您將無法使用Web上的大量文檔，而無需先將其更改爲ES5語法。使用http://redux.js.org/docs/api/作爲參考，您的線路是：

var createStore = Redux.createStore

來源

2016-08-03 04:53:27

我已經在build中使用babel-cli進行編譯，所以這不是問題。該行變成'var _redux = require（「redux」）' –

我很困惑 - 你在建立或使用CDN中的文件嗎？ –

如果你已經開始使用CDN中的文件，我可能無法幫助你，因爲我從來沒有真正設置過它。如果你願意嘗試上面的create-react-app方法，你可能會有更多的運氣。 –

您應該添加browserify咕嚕任務由巴貝爾捆綁編譯的JS。 browserify包含一個小型的CommonJS需求模塊，該模塊執行required方法。

這裏是我的browserify咕嚕任務：

module.exports = function(grunt) { 

    var files = { 
    '.tmp/public/js/z/bundle-<%= githash.main.hash %>.js': ['assets/js/**/*.jsx'] 
    }; 

    grunt.config.set('browserify', { 
    dist: { 
     options: { 
     transform: [['babelify', {presets: ['airbnb']}]] 
     }, 
     files: files, 
    }, 
    }); 

    grunt.loadNpmTasks('grunt-browserify'); 
};

此外，你應該添加到您的package.json下開發的依賴。

"devDependencies": { 
    "babel-preset-airbnb": "^2.1.1", 
    "babel-preset-es2015": "^6.16.0", 
    "babel-preset-react": "^6.16.0", 
    "babelify": "^7.3.0", 
    "grunt-browserify": "^5.0.0" 
}

來源

2016-10-11 03:13:35 Dzanvu

如何在不使用requirejs的情況下使用redux？

回答

相關問題