Question

使用axios来处理我正在构建的React应用程序的服务器请求，但是即使模块明显位于我的package.json文件中，我的标题中的错误仍然会抛出。我也尝试过使用npm卸载并重新安装，但是找不到axios。我是否要求不正确？我已经搜索了几天答案，但是找不到任何帮助。任何关于错误的信息/我在做什么错的信息将不胜感激。提前致谢。

*服务器文件

const express = require("express");
const app = express();
const compression = require("compression");
const db = require("./db/db");
const cookieParser = require("cookie-parser");
const cookieSession = require("cookie-session");
const bodyParser = require("body-parser");
const bc = require("./db/bcrypt");
const csurf = require("csurf");
const path = require("path");
const fs = require("fs");

app.use(cookieParser());

app.use(
  cookieSession({
    secret: `Not the real secret I would use normally`,
    maxAge: 1000 * 60 * 60 * 24 * 14
  })
);

app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());

app.use(express.static("public"));

app.use(compression());

if (process.env.NODE_ENV != "production") {
  app.use(
    "/bundle.js",
    require("http-proxy-middleware")({
      target: "http://localhost:8081/"
    })
  );
} else {
  app.use("/bundle.js", (req, res) => res.sendFile(`${__dirname}/bundle.js`));
}

const diskStorage = multer.diskStorage({
  destination: function(req, file, callback) {
    callback(null, __dirname + "/uploads");
  },
  filename: function(req, file, callback) {
    uidSafe(24).then(function(uid) {
      callback(null, uid + path.extname(file.originalname));
    });
  }
});

const uploader = multer({
  storage: diskStorage,
  limits: {
    fileSize: 2097152
  }
});
app.get("*", function(req, res) {
  res.sendFile(__dirname + "/index.html");
});

app.listen(8080, function() {
  console.log("I'm listening.");
});

* start.js文件

import React from "react";
import ReactDOM from "react-dom";
import axios from "/axios";
import App from "./App";

let component;

component = <App />;

ReactDOM.render(component, document.querySelector("main"));

* App.js文件

import React, { Component } from "react";
import { BrowserRouter, Route } from "react-router-dom";
import axios from "/axios";
import Navbar from "./navbar";
import Beers from "./beers";
import Facts from "./facts";

class App extends Component {
  constructor() {
    super();
    this.state = {};
  }
  componentDidMount() {}
  render() {
    return (
      <BrowserRouter>
        <div id="app">
          <Navbar />
          <Route eaxct path="./beers" component={Beers} />
          <Route exact path="./facts" component={Facts} />
        </div>
      </BrowserRouter>
    );
  }
}

export default App;

package.json依赖项

"dependencies": {
        "axios": "^0.18.0",
        "babel-cli": "^6.18.0",
        "babel-core": "^6.20.0",
        "babel-loader": "^6.2.9",
        "babel-plugin-transform-async-to-generator": "^6.24.1",
        "babel-plugin-transform-object-rest-spread": "^6.26.0",
        "babel-polyfill": "^6.26.0",
        "babel-preset-es2015": "^6.18.0",
        "babel-preset-latest": "^6.16.0",
        "babel-preset-react": "^6.16.0",
        "bcryptjs": "^2.4.3",
        "body-parser": "^1.15.2",
        "compression": "^1.7.0",
        "cookie-parser": "^1.4.3",
        "cookie-session": "^2.0.0-alpha.2",
        "csurf": "^1.9.0",
        "express": "^4.14.0",
        "http-proxy-middleware": "^0.17.4",
        "knox": "^0.9.2",
        "multer": "^1.3.0",
        "react": "^16.2.0",
        "react-dom": "^16.2.0",
        "react-redux": "^5.0.5",
        "react-router": "^4.2.0",
        "react-router-dom": "^4.2.2",
        "redux": "^3.7.1",
        "redux-devtools-extension": "^2.13.2",
        "redux-promise": "^0.5.3",
        "socket.io": "^2.0.3",
        "spiced-pg": "^1.0.0",
        "uid-safe": "^2.1.4",
        "webpack": "^1.14.0",
        "webpack-dev-middleware": "^1.8.4"
    },

Answer 1

尝试这样导入axios：

import axios from 'axios"

不带“ /”

控制台错误“未捕获的错误：在webpackMissingModule上找不到模块“ / axios””

1 个答案: