1
我有一個React項目,當我在chrome中打開它的路徑時在本地工作。然而,當試圖部署到Heroku的(或運行npm start
),我得到這個錯誤:反應:運行npm時意外的令牌導入開始
import React from 'react';
^^^^^^
SyntaxError: Unexpected token import
我已經沖刷的StackOverflow和Heroku的支持頁面無濟於事。
這裏是我的package.json:
{
"name": "my-app-name",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"webpack": "webpack",
"start": "node ./my-app-name.jsx",
"postinstall": "webpack"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"babel-cli": "^6.24.0",
"babel-core": "^6.24.0",
"babel-loader": "^6.4.1",
"babel-preset-es2015": "^6.24.0",
"babel-preset-react": "^6.23.0",
"react": "^15.4.2",
"react-dom": "^15.4.2",
"react-redux": "^5.0.3",
"react-router": "^4.0.0",
"react-router-dom": "^4.0.0",
"redux": "^3.6.0",
"webpack": "^2.3.2"
},
"engines": {
"node": "6.2.1",
"npm": "4.4.4"
}
}
而且我webpack.config.js:
module.exports = {
entry: "./my-app-name.jsx",
output: {
filename: "./bundle.js"
},
module: {
loaders: [
{
test: [/\.jsx?$/, /\.js?$/],
exclude: /(node_modules)/,
loader: 'babel-loader',
query: {
presets: ['es2015', 'react']
}
}
]
},
devtool: 'source-map',
resolve: {
extensions: ["*",".js", ".jsx" ]
}
};
我的節點和NPM版本中的package.json列出的相同。我進行了三重檢查,確保所有內容都已正確安裝,並且其他StackOverflow答案都沒有幫助。當然,它必須是巴貝爾的某種問題(由於它不承認import
),但我無法弄清楚它是什麼。
我改變了它'node./ bundle.js'現在我得到一個'ReferenceError:document is not defined'在我的包中on'document.addEventListener' –
我懷疑代碼沒有在瀏覽器環境中運行。也許github回購所以我可以進一步幫助你? – sammkj
如果您需要同時支持瀏覽器和節點j,您將不得不以不同方式構造代碼,針對每個環境,甚至只需使用條件檢查來打包環境特定的函數,這也可能很有用:https:// www。 npmjs.com/package/is-dom – corse32