I'm so lost. Someone help me get this package running!

Glitch Help
#1

I’ve been through 2 weeks of npm tutorials and I can’t figure this out. I am comfy with JS but new to webpack/npm.
I want to get this package working: waveform-playlist. I can’t get it to build and run. What am I missing, please? Here on Glitch I just get invalid host headers. I’ve read other posts on here about that and tried those solutions with no luck.

#2

@always_a_newbie
Hi there!
You’re gonna have to give us a bit more info to understand the issue. What is it you are trying to do? What are the exact errors you get?

1 Like
#3

At this point, I just want to get the app to run! I get the message " invalid host headers"

#4

Can you send screenshots of the logs and what files the error points to?

Screen Shot 2020-08-27 at 4.56.35 PM
Screen Shot 2020-08-27 at 4.56.35 PM488×830 38.7 KB

This is the rather complex file tree I see. Where do you think the error is coming from?

#5

Hey @always_a_newbie,

This error occurs as part of Webpack adds a host check while running a development server. In your webpack.config.js, add the following lines of config:

devServer: {
  compress: true,
  disableHostCheck: true,   
}

This how your webpack.config.js should look after adding that code:

module.exports = {
  entry: __dirname + "/src/app.js",
  output: {
    path:  __dirname + "/dist/waveform-playlist/js",
    publicPath: "/waveform-playlist/js/",
    filename: 'waveform-playlist.var.js',
    library: 'WaveformPlaylist',
    libraryTarget: 'var'
  },
  devtool: "#source-map",
  module: {
    loaders: [{
      test: /\.js?$/,
      exclude: /node_modules/,
      loader: 'babel-loader'
    }]
  }
  devServer: {
    compress: true,
    disableHostCheck: true,   
  }
};

Hope this helps!

1 Like
#6

Thank you SO MUCH! You guys are STARS!!

1 Like