I'm writing a small application using angular for frontend, my frontend module has the following structure:
In my app.js I'm defining main angular module:
angular.module('weatherApp', []);
My controller(weather.js) is registering WeatherCtrl:
angular.module('weatherApp')
.controller('WeatherCtrl', ['$scope', 'WeatherProvider', ($scope, WeatherProvider) => {
$scope.location = {
city: "",
country: ""
};
$scope.options = [
{ label: "Weather", value: "weather" },
{ label: "Forecast", value: "forecast" }
];
$scope.selected = $scope.options[0];
$scope.result = "Empty";
$scope.getWeather = function () {
WeatherProvider.getWeatherFunc($scope.selected.value, $scope.location.city, $scope.location.country)
.then((response) => {
$scope.result = response.data;
})
}
}]);
While serevice(provider.js) is registering WeatherProvider:
angular.module('weatherApp')
.service('WeatherProvider', ['$http', function($http) {
this.getWeatherFunc = (weatherMode, city, country) => {
return $http({
method: 'GET',
url: "http://localhost:8080/" + weatherMode + "/" + city + "/" + country
})
}
}]);
My webpack config looks like:
var path = require('path');
var webpack = require('webpack');
var HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
devServer: {
disableHostCheck: true
},
target: 'web',
context: path.join(__dirname, "src"),
devtool: 'source-map',
entry: {
app: "./app.js",
},
resolve: {
modules: [
path.resolve(__dirname),
"node_modules"
],
extensions: ['.js', '.html']
},
module: {
loaders: [
{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel-loader',
}
]
},
output: {
path: path.join(__dirname, 'src'),
filename: "bundle.js",
publicPath: "/"
},
plugins: [
new HtmlWebpackPlugin({
template: __dirname + "/src/index.tmpl.html"
}),
new webpack.DefinePlugin({
'process.env': {
'NODE_ENV': JSON.stringify(process.env.NODE_ENV ||"dev"),
}
})
],};
Here is index.tmpl.html:
Now I'm running npm run dev and http://localhost:8081/ gives me the following result:
An error says: Error: $controller:ctrlreg A controller with this name is not registered. In the same time http://localhost:8081/index.tmpl.html returns the expected result:
Do you have any idea why my controller and service are not in bundle.js? (I believe this is the main reason of a failure)



