приложение не определен после пакетирования

Question

Я бегу browserify на мой код, он выглядит следующим образом:

import './app'; 

//——————————————————————————————————————————————————// 
// Components 
//——————————————————————————————————————————————————// 

import './components/_ntToggleClass'; 

приложение просто

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

в то время как файлы в components, ну, компоненты. Но они с использованием app вышеупомянутый:

app.directive('ntToggleClass',() => { 
    ... } 

Когда я положил все в одном файле вручную, все работало. Но после того, как я использовал browserify на это, я получаю

Uncaught ReferenceError: app is not defined

Когда я смотрю в коде, как var app и директива там.

Answer 1

Моего друг пришел с помощью ;-)

Я использую Бабель (я думал, что РВП был очевиден, так как я использовал import не require) для моего кодирования (Babelify с es2015, если быть точным), поэтому, поскольку у меня есть import, мне также нужен export.

Решение очень простое, все, что я должен был сделать, это положить

export default app; 

в конце моего app.js файла, а затем импортировать его с помощью

import app from '../app'; 

в мои директивы/компонентов и т.д.

Answer 2

Я хлопнул вместе быстрый образец на github. Это даст вам рабочий репозиторий, который запускает браузер.

Я удалил свои предыдущие комментарии, так как я думаю, что репо должно ответить на ваши вопросы.

Редактировать: Я думаю, что я только что получил ваш вопрос, вы пытались создать глобальную переменную app, чтобы просто использоваться в каждом другом файле? Это невозможно при использовании браузера, любая переменная, которая не required в вашем файле, будет возвращена undefined.

При использовании функции браузера просто требуется то, что вам нужно.

Answer 3

Я думаю, что это касается определения порядка.

const app = angular.module('app', []); Эта часть должна быть верхней части ниже:

app.directive('ntToggleClass',() => { 
    ... }