All geek questions in one place

Import angular translation imports an empty object

I am using JSPM 0.16.42 which uses SystemJS , I tried both angular-translate and angular-route , both of which are on github endpoints.

However, for both of them angular produces the same error

argument module is not a function

when used in ES6 syntax as follows:

import AngularRoute from 'angular-route';

angular.module('app', [AngularRoute]);

I use babel as a transporter. The object that I am returning from the import appears empty. Below is the relevant part of my file config.js:

System.config({
  baseURL: "/",
  defaultJSExtensions: true,
  transpiler: "babel",
  babelOptions: {
    "optional": [
      "runtime",
      "optimisation.modules.system"
    ]
  },
  paths: {
    "github:*": "jspm_packages/github/*",
    "npm:*": "jspm_packages/npm/*"
  },
  map: {
    "angular-route": "github:angular/bower-angular-route@1.5.8",
    "angular-translate": "github:angular-translate/bower-angular-translate@2.11.1",
  }...

EDIT: When I tried to install angular-translatewith npm endpoint, I got an error http://errors.angularjs.org/1.5.8/$injector/unpr?p0=e in the next line inangular.js

return new ErrorConstructor(message);

which, I think, has advanced a bit, but still does not solve the problem.

EDIT # 2: angular -route @artem npm, - github , jspm install npm:angular-route. , github , npm

# 3: , ,

"npm:angular-translate@2.11.1": {
        "format": "global",
        "dependencies": {
          "angular": ">=1.2.26"
        },
        "shim": {
          "angular-translate": {
            "deps": "angular"
          }
        }
      }
+4
2

, angular -, angular -route npm (github),

jspm install npm:angular-route

&

jspm install npm:angular-translate -o '{dependencies: { angular: ">=1.2.26" } }'

angular - , jspm , angular: ">= 1.2.26 <=1.6", github

+2

, - angular - systemjs:

npm install jspm
./node_modules/.bin/jspm install github:angular-translate/angular-translate

<ENTER> ,

test.js

import AngularTranslate from 'angular-translate/angular-translate';

console.log(AngularTranslate);

index.html

<!doctype html>
<html>
<head>
    <script src="jspm_packages/system.src.js"></script>

    <script src="config.js"></script>
    <script>
        System.import('./test.js');
    </script>

</head>
<body>
</body>
</html>

:

Failed to load resource: the server responded with a status of 404 (File not found)
undefined:1 Uncaught (in promise) Error: (SystemJS) XHR error (404 File not found) loading 
http://localhost:8035/jspm_packages/github/angular-translate/angular-translate@2.11.1.js(…)

? jspm, angular-translate npm,

module.exports = require("npm:angular-translate@2.11.1/dist/angular-translate.js");

( .js ) , package.json:

"main": "dist/angular-translate.js",

angular - github, dist. jspm - .

, , github:

cd jspm_packages/github/angular-translate/angular-translate@2.11.1/
npm install
npm run-script build
cd ../../../..

config.js:

  map: {
      "angular-translate/angular-translate": "github:angular-translate/angular-translate@2.11.1/dist/angular-translate",

index.html :

system.src.js:122 Uncaught (in promise) Error: (SystemJS) angular is not defined(…)

, angular angular -translate, systemjs, .

config.js:

  meta: {
    "angular-translate/angular-translate": {
        "deps": ["angular"]
      }
  },


  map: {
    "angular": "github:angular-translate/angular-translate@2.11.1/node_modules/angular/angular",

. format angular -. SystemJS - 'amd' 'cjs', 'global'. , , , angular -translate, angular.js .

index.html. :

pascalprecht.translate

angular - - .

angular.js, .

PS angular -route npm github?

npm jspm jspm_packages/npm/angular-route@1.5.8.js,

module.exports = require("npm:angular-route@1.5.8/index.js");

package.json angular -route

  "main": "index.js",

.

github jspm jspm_packages/github/angular/bower-angular-route@1.5.8.js,

module.exports = require("github:angular/bower-angular-route@1.5.8/angular-route");

- jspm https://github.com/jspm/registry/blob/master/package-overrides/github/angular/bower-angular-route%401.3.0.json

bower.json bower- angular -route

"main": "./angular-route.js",

, , , - .

TL; DR , .

+2

Source: https://habr.com/ru/post/1652200/

More articles:


All Articles