Question

我试图在我的角度应用程序中使用webpack，但每当我尝试将html加载到模板时，我都会收到错误。这是我目前得到的那个：

模块解析失败：C：\ Users \ Fabian \ Dropbox \ FixMyCity \ FixMyCity \ src \ FixMyCity.Web \ App \ settings \ settings.html意外令牌（1：0）
您可能需要适当的加载程序来处理此文件类型。

这让我觉得我没有正确的html加载器，但我已经尝试了raw-loader和html-load这两个并没有为我工作。

这是我目前的webpack.config.js

module.exports = {
    entry: './App/app.js',
    output: {
        filename: './wwwroot/app-bundle.js'
    },
    loaders: [

            { test: /\.html$/, loader: 'html' },
            { test: /\.css$/, loader: 'style!css' },
    ]
};

app.js

var app = angular.module('app', ['auth0', 'angular-storage', 'angular-jwt', 'ngRoute'])
.config(['$routeProvider', 'authProvider', 'jwtInterceptorProvider', '$httpProvider', configFunction])


function configFunction($routeProvider, authProvider, jwtInterceptorProvider, $httpProvider) {
    // Configure routes for your application
    $routeProvider
      .when('/', {
          controller: 'HomeCtrl',
          template: require('./home/home.html'),
          requiresLogin: true
      })
}

Answer 1

你必须从npm安装html-loader，然后你就可以在属性加载器中放入值'html-loader'。

像这样：

module.exports = {
entry: './App/app.js',
output: {
    filename: './wwwroot/app-bundle.js'
},
loaders: [

        { test: /\.html$/, loader: 'html-loader' },
        { test: /\.css$/, loader: 'style!css' },
]};

如何使用带角度1.x和webpack的模板

1 个答案: