导入错误：“unsplash-js”不包含默认导出（导入为“Unsplash”）答案

【问题标题】：import error: 'unsplash-js' does not contain a default export (imported as 'Unsplash')导入错误：“unsplash-js”不包含默认导出（导入为“Unsplash”）
【发布时间】：2021-06-19 12:02:32
【问题描述】：

下面是我的代码sn-p：

import React, { useState } from "react";
import Unsplash, { toJson } from "unsplash-js";
const unsplash = new Unsplash({
    accessKey: "****",
    secret:"****"
  });
export default function SearchPhotos() {
  const [query, setQuery] = useState("");
  console.log(query);
  const searchPhotos = async (e) => {
    e.preventDefault();
    unsplash.search
    .photos(query)
    .then(toJson)
    .then((json) => {
      console.log(json);
    });
    console.log("Submitting the Form")
  };

我在 React 应用程序中遇到此错误尝试导入错误：“unsplash-js”不包含默认导出（导入为“Unsplash”）。我已经签入了辅助函数，但仍然没有遇到 Unsplash 和 toJson 的导入错误。

【问题讨论】：

你在用这个包吗：npmjs.com/package/unsplash-js?
是的，我已经通过 npm 安装了它
使用示例可以参考项目的GitHub repo：github.com/unsplash/unsplash-js#readme
我之前浏览过这个链接；我已经安装了所有软件包，但仍然发现同样的问题
嗯，这是working demo。

标签： reactjs api npm npm-start

【解决方案1】：

希望您使用的是最新版本的 unsplash，请尝试使用以下命令安装旧版本的 upslash

npm install unsplash-js@6.0.0

由于新版本的 unsplash-js 做了很多改动

【讨论】：

【解决方案2】：

这个对我有用

import { createApi } from 'unsplash-js';

const unsplash = createApi({ accessKey: 'YOUR_ACCESS_KEY' });

unsplash.search.getPhotos({
  query: query
}).then(result=>{console.log(result)})

【讨论】：

【解决方案3】：

您可以使用带有访问令牌的官方包，

这是一个有效的代码，

import fetch from 'node-fetch';
global.fetch = fetch;
import Unsplash, {
    toJson
} from 'unsplash-js';
const ACCESS_KEY = 'YOUR_TOKEN';

const unsplash = new Unsplash({
    accessKey: ACCESS_KEY,
    headers: {
        "X-Custom-Header": "foo"
    },
    timeout: 5000
});

const getSearchedImagesFromUnsplash = async (searchTerm) => {

    let user = Meteor.user();

        try {
            let response = await unsplash.search.photos(searchTerm, 1, 50).then(res => res.json());
            return response;
        } catch (e) {
            console.log('error\n', e);
        }

}
//Get the images
getSearchedImagesFromUnsplash('Nature')

【讨论】：

【解决方案4】：

使用这个：

import { createApi } from 'unsplash-js';

// on your node server
const serverApi = createApi({
  accessKey: 'MY_ACCESS_KEY',
  //...other fetch options
});

// in the browser
const browserApi = createApi({
  apiUrl: 'https://mywebsite.com/unsplash-proxy',
  //...other fetch options
});

对于获取部分，像这样使用：

 unsplash.search.getPhotos({
        query: query
    }).then(result=>{console.log(result)})

欲了解更多信息，请访问：https://www.npmjs.com/package/unsplash-js

【讨论】：