countUp.js: angular2 Error: Cannot find module "."

Just use it in angular 2.2.3 and webpack. And it throw Error: Cannot find module "."

About this issue

Original URL
State: closed
Created 7 years ago
Comments: 20 (10 by maintainers)

Most upvoted comments

@inorganik It’s not clear to me if there is any issue here, as per my last comment.

As documented in the README, you must make sure the Countup object is available to your application as a global.

This needs to be the case irrespective of how you bundle or load modules. The Angular directive is a simple wrapper around the core technology, which happens to be a javascript global.

I have never used webpack, but according to @szykov’s comment there is a plugin for webpack called ProvidePlugin that is able to provide globals. People using webpack should try using that, or similar.

I will try to find time to personally verify the webpack scenario, hopefully by this weekend.

In the meantime I would recommend closing this issue, unless @szykov or @hameltomor have experienced any errors when following the instructions? I have been using this directive for a while now and never encountered any issues.

vigie on Mar 1, 2017

I’m still having this issue with a fresh Angular 4 app. I’ve included the CountUpModule in my app.

...
import { ClaimModule } from './claim/claim.module';

@NgModule({
  declarations: [
    AppComponent,
  ],
  imports: [
    ...
    CountUpModule
  ],
...
})

export class AppModule {}

And I’ve added

import 'countup.js/dist/countUp';
import 'countup.js/dist/angular-countUp';

to polyfills.ts. And the error in the console:

countUp.module.js:15 Uncaught Error: Cannot find module "."
    at webpackMissingModule (countUp.module.js:15)
    at webpackJsonp.../../../../countup.js/dist/countUp.module.js.Object.defineProperty.value (countUp.module.js:15)
    at Object.../../../../countup.js/dist/countUp.module.js (countUp.module.js:21)
    at __webpack_require__ (bootstrap bde483c5bce87e16b45c:54)
    at Object.../../../../../src/app/app.module.ts (app.config.ts:5)
    at __webpack_require__ (bootstrap bde483c5bce87e16b45c:54)
    at Object.../../../../../src/main.ts (environment.ts:8)
    at __webpack_require__ (bootstrap bde483c5bce87e16b45c:54)
    at Object.2 (main.bundle.js:3825)
    at __webpack_require__ (bootstrap bde483c5bce87e16b45c:54)
webpackMissingModule @ countUp.module.js:15
webpackJsonp.../../../../countup.js/dist/countUp.module.js.Object.defineProperty.value @ countUp.module.js:15
../../../../countup.js/dist/countUp.module.js @ countUp.module.js:21
__webpack_require__ @ bootstrap bde483c5bce87e16b45c:54
../../../../../src/app/app.module.ts @ app.config.ts:5
__webpack_require__ @ bootstrap bde483c5bce87e16b45c:54
../../../../../src/main.ts @ environment.ts:8
__webpack_require__ @ bootstrap bde483c5bce87e16b45c:54
2 @ main.bundle.js:3825
__webpack_require__ @ bootstrap bde483c5bce87e16b45c:54
webpackJsonpCallback @ bootstrap bde483c5bce87e16b45c:25
(anonymous) @ main.bundle.js:1
client?ffdb:41 [WDS] Warnings while compiling.
client?ffdb:106 ./~/countup.js/dist/countUp.module.js
15:24-31 Critical dependency: require function is used in a way in which dependencies cannot be statically extracted

JWesorick on Aug 1, 2017