Error encountered while exporting TypeScript module

While I am working with Angular, TypeScript, and Gulp, my module system is CommonJS. However, I encountered an error when trying to import a module into my main.ts file:

Error: Cannot find external module 'modules.ts'.

Here is the snippet from my main.ts file:

/// <reference path="../../typings/tsd.d.ts" />

import modules from 'modules.ts';

const app = angular.module('myApp', []);

And this is the content of modules.ts file:

module test {
    export class a {

    }
}

Answer №1

It appears that the issue you are facing is that the file modules.ts is not exporting anything, resulting in it not being compiled as a valid commonjs module.

To resolve this, you can try the following:

// modules.ts
export module test {

    export class a {

    }
}

Then, in another file:

import {test} from 'modules';

var foo = new test.a();

This solution should work for you. For a more in-depth understanding of the new import/export syntax, refer to the ES6 Modules documentation.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Expanding div width with jQuery as a percentage

Currently, I am facing a dilemma as I try to devise an equation for expanding the width of a div based on its current height. The Scenario Within this situation, there is a div that features a background image set to "contain." The original background ima ...

Trouble with Swiper carousel loading new slides

Currently, I am working on a project using Cordova and jQuery. I have implemented the Swiper library by idangero for handling slides. The problem arises when I add new slides and try to display them. Here is the relevant jQuery code snippet: if(row.pict ...

Why was the 'Symbol' type introduced in ECMA-262-v6 and what purpose does it serve?

Can you explain the purpose of the 'Symbol' type in ECMA-262-v6? Is it used for fast path implementation for object keys? How does it work internally - does it hash with the assurance that the underlying data remains unchanged? ...

Submitting a form in AngularJS for routing to a different state

I have a primary webpage featuring just one search box. <div class="input-group" ng-controller="MainSearchCtrl"> <input type="text" class="form-control" ng-model="term"> <span class="input-group-btn"> <button class="btn btn ...

The inability to read property 0 of undefined persists despite implementing conditional rendering

I'm struggling to understand what mistake I'm making in the current situation: There's an array named arrayOfChildren that gets initialized like this: const [arrayOfChildren, setArrayOfChildren] = React.useState([]) With a handler function ...

I am looking for a custom script for a splash page that will automatically redirect users to one of three designated pages based on the information stored

As a programmer, I'm well-versed in coding but lack knowledge about creating and utilizing cookies. If anyone could provide guidance on this matter, it would be highly appreciated. I believe I require two concise scripts for this task. 1st Script: T ...

The iconbar feature in the mobile menu is experiencing functionality issues

I am currently experimenting with the iconbar property of mmenu (here: ) Unfortunately, I am encountering an issue. The menu opens as expected when I run the code. However, upon closing the menu, it first closes completely and then the container slides sl ...

Utilize the Multer file upload feature by integrating it into its own dedicated controller function

In my Express application, I decided to keep my routes.js file organized by creating a separate UploadController. Here's what it looks like: // UploadController.js const multer = require('multer') const storage = multer.diskStorage({ dest ...

Installing and importing Angular Google Maps in an Angular 2 application using TypeScript: A step-by-step guide

Can you provide step-by-step instructions on integrating angular-google-maps into an Angular 2 application and importing it for use in a TypeScript component? ...

External JavaScript file not executing defined function

My homepage includes a register form that should open when the register button is clicked. However, I am encountering an issue where the function responsible for opening the form from another JavaScript file is not being triggered. Here is the HTML code: ...

Utilizing functions as parameters and implementing a flexible number of arguments

I have two different functions: Function called 'first' which takes 1 argument Another function called 'second' that takes 2 arguments Next, there is a third function that accepts a function and a value as its parameters. I am strugg ...

Removing punctuation from time duration using Moment.js duration format can be achieved through a simple process

Currently, I am utilizing the moment duration format library to calculate the total duration of time. It is working as expected, but a slight issue arises when the time duration exceeds 4 digits - it automatically adds a comma in the hours section (similar ...

Encountering a 503 Error in Loading .js Files from Index.html in a .NET 7.0 Angular Application

I recently came into possession of an Angular project that I am trying to set up in IIS, but I am encountering some unusual behavior. Since I am relatively new to Angular, I ask for your patience as I navigate through this issue. Upon loading the website, ...

how to check if a string has white spaces in a react application

If the input string has white space, the alert will indicate unsuccessful. If the input string does not have any white space, the alert will be successful. import React from "react"; export default function DropDown() { let i = document.getEle ...

Issue with Angular ngFor not updating radio button value when ngModel is set

Hello, I am fairly new to working with Angular and could really use some assistance with a problem I've run into. Essentially, I am receiving an array of objects from an API like this: [{name: "abc", score: 2},{name: ""def, score: ...

JQuery magic: Enhancing a div's visibility with animated mouseover effects

I'm trying to figure out how to animate a div on mouseover, specifically making it fade in/appear slowly. I believe I need to use the .animate function or something similar. $("#logo").mouseover(function() { $("#nav").css('visibility',&apos ...

Obtaining connected information in AngularJS with Firebase

After reviewing the example found at the following link: I am curious to know if AngularFire can be used to retrieve and show relational data (referred to as sparks) in a similar manner? ...

The key is not applicable for indexing the type as expected

Here is the TS code I am working with: type Fruit = { kind: "apple" } | { kind: "grape"; color: "green" | "black" }; type FruitTaste<TFruit extends Fruit> = TFruit["kind"] extends "apple" ? "good" : TFruit["color"] extends "green" ? "good" : ...

Tips on rearranging the location of a div element within a directive

I have created a custom directive that displays two divs, Div1 and Div2, with a splitter in the middle: Splitter Image Now, I am looking for a way to swap the positions of these two divs dynamically using an Angular directive. I thought about using ng-swi ...

Utilizing JQuery to make Google listings easily findable

Implementing Google Places for a location text box has been successful. However, I am now looking to create a class-based implementation so that I can use it with multiple places effortlessly. Is it possible to achieve this using JQuery? <script type ...