A1AtScript

0.5.0 verified Fri May 01 auth: no javascript maintenance

a1atscript (v0.5.0) is a polyfill for Angular 2 style annotations and dependency injection, designed to work with Angular 1.x. It allows developers to use Angular 2-like syntax (e.g., @Controller, @Service, @Component, @View) when building Angular 1 applications, provided an ES6 transpiler like Babel or Traceur is used. The library supports module definition, bootstrap, and integration with the new Angular router. It is currently in an early, experimental stage with slow release cadence and limited adoption; no security issues have been reported. It serves as a bridge for teams transitioning from Angular 1 to Angular 2.

Common errors

error Module is not defined ↓

cause Forgetting to import Module or using it without transpiler.

fix

Ensure you have 'import { Module } from 'a1atscript'' and a transpiler is set up.

error Error: [$injector:modulerr] Failed to instantiate module ↓

cause Incorrect module dependencies or circular dependency.

fix

Check that all referenced modules are correctly imported and no circular dependencies exist.

error Annotation is not a function ↓

cause Using annotations without transpiler or incorrect import.

fix

Ensure you are importing the annotation correctly and using a transpiler that supports decorators (e.g., Babel with legacy decorator plugin).

Warnings

gotcha Requires ES6 transpiler (Babel or Traceur) for annotations to work. Not compatible with plain ES5. ↓

fix Use a build system with Babel or Traceur to transpile code before running.

gotcha The library is a polyfill for Angular 2 style but only covers a subset of features; not all Angular 2 patterns are supported. ↓

fix Consult the Angular 2 migration guide and use official upgrade tools for complex scenarios.

deprecated The Angular new router (angular-new-router) integration is experimental and may not be maintained. ↓

fix Consider using UI-Router or ngRoute for routing.

Install

npm install a1atscript

yarn add a1atscript

pnpm add a1atscript

Imports

Controller

wrong

import Controller from 'a1atscript'

correct

import { Controller } from 'a1atscript'

Named export; default import not available.

Service

wrong

var Service = require('a1atscript').Service

correct

import { Service } from 'a1atscript'

ES module; CommonJS require still works but not recommended.

Module

wrong

const { Module } = require('a1atscript')

correct

import { Module } from 'a1atscript'

Named export; used for creating Angular modules.

bootstrap
wrong
```
import { bootstrapModule } from 'a1atscript'
```
correct
```
import { bootstrap } from 'a1atscript'
```
Named export; bootstrap function takes a module and optional prefix.

Component

wrong

import { Component as NgComponent } from 'a1atscript'

correct

import { Component } from 'a1atscript'

Named export; used as annotation.

View
```
import { View } from 'a1atscript'
```
Named export; used as annotation for component templates.

Quickstart

Shows how to define a service and controller using annotations, create a module, and bootstrap the app.

import { Controller, Service, Module, bootstrap } from 'a1atscript';

@Service('MyService')
class MyService {
  constructor() {
    this.value = 42;
  }
}

@Controller('MyController', ['$scope', 'MyService'])
class MyController {
  constructor($scope, MyService) {
    $scope.value = MyService.value;
  }
}

const appModule = new Module('myApp', [MyService, MyController, 'ngRoute']);
bootstrap(appModule, 'app');