angular1 应用上的 es5 到 es6 + webpack答案

【问题标题】：es5 to es6 + webpack on angular1 appangular1 应用上的 es5 到 es6 + webpack
【发布时间】：2017-01-04 19:40:09
【问题描述】：

我正在将 Angular1 转换为 es6 并开始使用 webpack。因此，我需要在所有文件中使用“导入/导出模块”。

我需要在我拥有的每个文件 js 上导入模块吗？例如，即使是角度的 $window ？即使在路由器的解析上？

我正在为转换而苦苦挣扎。

在大型应用程序上是否有简单的方法？

谢谢！

【问题讨论】：

简而言之：没有太大的改变。你能给我们举个例子，你到底在努力解决什么问题吗？看看Todd Motto's Styleguide。

标签： angularjs webpack ecmascript-6 es5-shim

【解决方案1】：

导入 Angular 时会导入 $window、$timeout、$http 等内容对于任何其他第三方模块，您需要导入文件，但也需要将其注入到应用模块中

例子：

app.js

 import angular from 'angular';
 import 'angular-ui-router';  // A third-party npm module
 import './controllers/users';  // Custom controller
 import config from './config';  // Custom function
 import run from './app.run'; // Custom function
 const app = angular.module('MyApp', [
   'ui.router',
   'MyApp.controllers.users'
 ]);
 app.config(config);
 app.run(run);

控制器/user.js

import angular from 'angular';
import '../services/user';
import './modals/users';

const module = angular.module('MyApp.controllers.users', [
  'MyApp.services.user',
  'MyApp.services.globals',
  'MyApp.modals.user',
]);

const UsersController = ($scope, UserService) => {
  'ngInject';
  $scope.title = 'Users';

  $scope.users = UserService.GetAll();
}
module.exports = module.controller('UsersController', UsersController);

【讨论】：