1
when using export default class in javascript, I’m not getting to use the functions I imported.
Return to browser Inspect
Follows files:
index js.
/* global fetch */
import API_URL from './config';
import toJSON from './utils';
import album from './album';
import search from './search';
// const API_URL = require('./config');
// const toJSON = require('./utils');
// const album = require('./album');
// const search = require('./search');
export default class SpotifyWrapper {
constructor(options) {
this.apiURL = options.apiURL || API_URL;
this.token = options.token;
this.album = album.bind(this)();
this.search = search.bind(this)();
}
static request(url) {
const headers = {
headers: {
Authorization: `'Bearer ${this.token}'`,
},
};
return fetch(url, headers).then(toJSON);
}
}
album js.
export default function album() {
return {
getAlbum: id => this.request(`${this.apiURL}/albums/${id}`),
getAlbums: ids => this.request(`${this.apiURL}/albums/?ids=${ids}`),
getAlbumTracks: id => this.request(`${this.apiURL}/albums/${id}/tracks`),
};
}
search js.
function searcher(type, query) {
return this.request(`${this.apiURL}/search?q=${query}&type=${type}`);
}
export default function search() {
return {
artists: searcher.bind(this, 'artist'),
albums: searcher.bind(this, 'album'),
tracks: searcher.bind(this, 'track'),
playlists: searcher.bind(this, 'playlist'),
};
}
utils.js
const toJSON = data => data.json();
export default toJSON;
config.js
const API_URL = 'https://api.spotify.com/v1';
export default API_URL;
webpack.config.Babel.js
import { join } from 'path';
const include = join(__dirname, 'src');
export default {
mode: 'development',
entry: './index',
output: {
path: join(__dirname, 'dist'),
libraryTarget: 'umd',
library: 'spotifyWrapper',
},
devtool: 'source-map',
module: {
rules: [
{ test: /\.js$/, use: 'babel-loader' },
],
},
};
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Spotify Wrapper Test</title>
</head>
<body>
<script src="../dist/spotify-wrapper.umd.js"></script>
<script>
</script>
</body>
</html>