Can´t use AngularJS Charts when building with WRO4J

515 Views Asked by At

I´m trying to add AngularJS Charts to an Angular application I have (built with WRO4J). However, I can´t get it to work as I get these errors:

Uncaught ReferenceError: Chart is not defined(anonymous function) @ angular-bootstrap.js:15(anonymous function) 

Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.3.8/$injector/modulerr?p0=portfolio_manager&p…d%20(http%3A%2F%2Flocalhost%3A9999%2Fjs%2Fangular-bootstrap.js%3A2%3A90124)(anonymous function)

"Chart" is the module I have defined in my app.js:

angular.module('portfolio_manager', [ 'ngRoute','chart.js' ])

My wro.xml looks like this:

<groups xmlns="http://www.isdc.ro/wro">
  <group name="angular-bootstrap">
    <css>webjar:bootstrap/3.2.0/less/bootstrap.less</css>   
    <css>file:${project.basedir}/src/main/wro/main.less</css>
    <css>webjar:angular-chart.js/0.7.1/angular-chart.css></css>
    <js>webjar:jquery/2.1.1/jquery.min.js</js>
    <js>webjar:angularjs/1.3.8/angular.min.js</js>
    <js>webjar:angularjs/1.3.8/angular-route.min.js</js>
    <js>webjar:angularjs/1.3.8/angular-cookies.min.js</js>
    <js>webjar:angular-chart.js/0.7.1/angular-chart.min.js</js>
    <js>webjar:chartjs/1.0.2/Chart.js</js>
   </group>
</groups>

And the relevant part of my pom.xml

        <plugin>
            <groupId>ro.isdc.wro4j</groupId>
            <artifactId>wro4j-maven-plugin</artifactId>
            <version>1.7.6</version>
            <executions>
                <execution>
                    <phase>generate-resources</phase>
                    <goals>
                        <goal>run</goal>
                    </goals>
                </execution>
            </executions>
            <configuration>
                <wroManagerFactory>ro.isdc.wro.maven.plugin.manager.factory.ConfigurableWroManagerFactory</wroManagerFactory>
                <cssDestinationFolder>${project.build.directory}/generated-resources/static/css</cssDestinationFolder>
                <jsDestinationFolder>${project.build.directory}/generated-resources/static/js</jsDestinationFolder>
                <wroFile>${project.build.directory}/wro/wro.xml</wroFile>
                <extraConfigFile>${basedir}/src/main/wro/wro.properties</extraConfigFile>
                <contextFolder>${basedir}/src/main/wro</contextFolder>
                <ignoreMissingResources>false</ignoreMissingResources>
            </configuration>
            <dependencies>
                <dependency>
                    <groupId>org.webjars</groupId>
                    <artifactId>jquery</artifactId>
                    <version>2.1.1</version>
                </dependency>
                <dependency>
                    <groupId>org.webjars</groupId>
                    <artifactId>angularjs</artifactId>
                    <version>1.3.8</version>
                </dependency>
                <dependency>
                    <groupId>org.webjars</groupId>
                    <artifactId>bootstrap</artifactId>
                    <version>3.2.0</version>
                </dependency>
                <dependency>
                    <groupId>org.webjars</groupId>
                    <artifactId>angular-chart.js</artifactId>
                    <version>0.7.1</version>
                </dependency>
                <dependency>
                    <groupId>org.webjars</groupId>
                    <artifactId>chartjs</artifactId>
                    <version>1.0.2</version>
                </dependency>
            </dependencies>
        </plugin>

In my index.html I´m just importing the angular-bootstrap.js and css defined above in the WRO.xml file.

Any idea of what am I doing wrong? Thanks!

0

There are 0 best solutions below