Webpack seems to not be working

Coding Help
, ,
1

I currently have a webpack project and I have bundled halfmoon css and js together. The CSS part is working but the Javascript part does not work for some reason.

I have required both and Webpack says it is compiling both:

image
image970×255 24.1 KB

And some of the code in webpack’s bundle matches the code of Halfmoon’s. My problem is is that webpack might not be executing the code at all. Then I added console.log("Webpack loaded!"); to the bundle, actually works:
image

webpack.config.js

const path = require("path");
const { CleanWebpackPlugin } = require("clean-webpack-plugin");
module.exports = {
  entry: "./src/index.js",
  mode: "development",

  output: {
    filename: "bundle.js",
    path: path.resolve(__dirname, "dist")
  },
  module: {
    rules: [
      {
        test: /\.css$/,
        use: ["style-loader", "css-loader"]
      }
    ]
  },
  plugins: [new CleanWebpackPlugin()]
};

src/index.js

require("halfmoon/css/halfmoon.min.css"); // require halfmoon.css
require("halfmoon/js/halfmoon.js"); // require halfmoon.js
console.log("Webpack loaded!");

Code: https://glitch.com/edit/#!/cold-sly-maxilla
Project URL: https://cold-sly-maxilla.glitch.me/

Oh and by the way, halfmoon sets a “halfmoon” variable but it keeps saying Uncaught ReferenceError: halfmoon is not defined which is weird.

2

Why don’t you require the rest of the files?

3

Require the rest of the files?

4

Yeah, try that.

5

There are no other files.

6

uh ok

image
image1217×108 10.2 KB

7

You only have to use one of them:

halfmoon.js is the main halfmoon, nothing done to it.
halfmoon-module.js is halfmoon.js, but a module.
halfmoon.min.js is halfmoon.js but compressed.

8

Yee, I know nothing about halfmoon. I thought you had to use the module too.

9

Ok, I solved the problem

window.halfmoon = require("halfmoon");

for some weird reason in Webpack you have to “export” variables/functions by using window.<function>.

5 Likes
10

Yeah I’ve had even weirder issues with modules. I’ve had an issue that was like this but in reverse so nodejs require was working but loading from script tags was working


seems like module systems sometimes get weird
11

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.