import語句失敗的反應

我學反應，我有一個PHP項目設置是這樣的：import語句失敗的反應

在index.php文件的頭我加載：

<script type="text/javascript" src="js/libs/react.js"></script> 
<script type="text/javascript" src="js/libs/react-dom.js"></script> 
<script type="text/javascript" src="js/libs/browser.min.js"></script>

，並在底部：

<script type="text/babel" src="jsx/index.jsx"></script> 
<script> 
     window.onload=function(){ 
     site.init(); 
     }</script> 
</script>

我沒有做任何運輸。在Apache + Firefox上一切運行良好。

然後，我想添加一些轉換，如點擊按鈕而不是僅僅切換時圖像淡入淡出。所以我：

1-下載的反應過渡從這裏：https://github.com/reactjs/react-transition-group

2 - 添加了src文件夾中，以JS的內容，現在看起來是這樣的：

js/ 
../<some vanilla.js files> 
../libs/ 
../libs/react.js 
../libs/react-dom.js 
../libs/browser.min.js 
../libs/react-transition-group/ 
......./react-transition-group/index.js 
......./react-transition-group/CSSTransitionGroup.js 
......./react-transition-group/CSSTransitionGroup.js 
......./react-transition-group/TransitionGroup.js

3-加載索引。 JS是這樣的：

index.js:1 Uncaught SyntaxError: Unexpected token import

：

現在，Chrome瀏覽器，我當我運行的網站得到這個錯誤0

On Firefox：

SyntaxError: import declarations may only appear at top level of a module index.js:1

任何關於我錯過了什麼的想法？

感謝

來源

2017-04-15 JimYang

的瀏覽器不知道什麼進口，需要（）等。推薦閱讀：http://blog.andrewray.me/webpack-when-to-use-and-why/ –

使用導入，你不應該使用巴貝爾填充工具，但巴貝爾transpile的代碼。因此，高度鼓勵在使用babel插件的反應項目中使用webpack。

此博客可以幫助你進一步建立反應/的WebPack /巴貝爾項目：https://scotch.io/tutorials/setup-a-react-environment-using-webpack-and-babel

來源

2017-04-15 15:36:04 dejakob

@Andy Ray，@dejakob感謝您的鏈接。實際上我沒有在任何地方使用'import'，也不需要任何類型的transpiling來讓反應網站正常運行（在添加轉換之前）; 'import'被用在反應轉換庫的第一行index.js中，我預計它會用完。這是否意味着我除了在開發過程中添加一箇中間步驟來進行轉換之外沒有別的選擇？如在修改代碼 - > transpile->檢查瀏覽器與修改代碼 - >檢查瀏覽器？ – JimYang

在大多數前端項目中，某些類型的transpiling用於支持ES6和其他功能。有了正確的手錶設置和源代碼，這不是一個麻煩的國際海事組織。 – dejakob

安迪雷這裏所說http://blog.andrewray.me/webpack-when-to-use-and-why，它看起來像我在做事情的老辦法;車輪已經重新改造，我使用的php-webpacker-of-sort似乎開始落後。

看來，我很幸運地使用了一組庫，這些庫在導入時不會引起衝突，只需導入<script src=library.js>即可，並且反應過渡消除了這種錯覺。遵循dejakob的建議，我已經在整個過程中整合了transpiling，至少目前來看，事情似乎再次無縫工作。

感謝

來源

2017-04-17 11:25:43 JimYang

import語句失敗的反應

回答

相關問題