2017-06-03 63 views
1

我正在使用axios來構建帶有React.js的簡單天氣應用程序。我剛剛完成了代碼,但有一個問題。當我啓動該應用程序時,該程序根本無法工作,並且看到一個參考錯誤axios is not definedAxios未定義

這裏是我的webpack.config.js文件:

module.exports = { 
    entry: './public/app/app.jsx', 
    output: { 
     path: __dirname, 
     filename: './public/js/bundle.js' 
    }, 
    externals: ['axios'], 
    resolve: { 
     root: __dirname, 
     alias: { 
      OpenWeatherMap: 'public/components/OpenWeatherMap.jsx', 
      Main: 'public/components/Main.jsx', 
      Nav: 'public/components/Nav.jsx', 
      Weather: 'public/components/Weather.jsx', 
      WeatherForm: 'public/components/WeatherForm.jsx', 
      WeatherMessage: 'public/components/WeatherMessage.jsx', 
      About: 'public/components/About.jsx' 
     }, 
     extensions: ['', '.js', '.jsx'] 
    }, 
    module: { 
     loaders: [{ 
      loader: 'babel-loader', 
      query: { 
       presets: ['react','es2015', 'stage-0'] 
      }, 
      test: /\.jsx?$/, 
      exclude: /(node_modules|bower_components)/ 
     },{ 
      loader: 'json-loader', 
      test: /\.json?$/ 
     }] 
    } 
}; 

和的package.json文件:

{ 
    "name": "weather", 
    "version": "1.0.0", 
    "description": "Simple Weather App", 
    "main": "ext.js", 
    "scripts": { 
    "test": "echo \"Error: no test specified\" && exit 1" 
    }, 
    "author": "Milad Fattahi", 
    "license": "ISC", 
    "dependencies": { 
    "axios": "^0.16.1", 
    "express": "^4.15.3", 
    "json": "^9.0.6", 
    "json-loader": "^0.5.4", 
    "react": "^15.5.4", 
    "react-dom": "^15.5.4", 
    "react-router": "^4.1.1", 
    "react-router-dom": "^4.1.1" 
    }, 
    "devDependencies": { 
    "babel-core": "^6.5.1", 
    "babel-loader": "^6.2.2", 
    "babel-preset-es2015": "^6.5.0", 
    "babel-preset-react": "^6.5.0", 
    "babel-preset-stage-0": "^6.24.1", 
    "webpack": "^1.12.13" 
    } 
} 
+0

那麼哪些文件是你我們因爲你沒有導入它? – Ohgodwhy

+0

我只在OpenWeatherMap.jsx文件中使用axios,並且在該文件中導入了axios。 –

+0

你可以分享進口聲明 –

回答

3

我知道這似乎是顯而易見的,但要確保有在頂部的參考您的文件到正確的愛可信或安裝 https://www.npmjs.com/package/axios

<script src="https://unpkg.com/axios/dist/axios.min.js"></script> 
+1

我用npm安裝了axios,現在它可以正常工作。我唯一的錯誤是從webpack build中排除axios。 –

+1

我遇到了同樣的問題,直到將腳本標記放在我的所有代碼之上。具有完美的意義,因爲我甚至在定義之前稱之爲axios。感謝您的貢獻! – Cortifero