Webpack不處理控制器模板中的帕格文件

我最近更新了一個AngularJS（v1）項目，從Webpack v1更新爲v2，TypeScript v1更新爲v2。該項目使用帕格文件來生成視圖，並且在升級之前沒有問題。Webpack不處理控制器模板中的帕格文件

由於升級，控制器中引用的帕格文件不再由Webpack處理。任何路線中指定的帕格文件仍然正常工作。

我webpack.common.config.js具有與哈巴狗哈巴狗裝載配置：

module: { 
    rules: [ 
    { 
     test: /\.pug$/, 
     use: ['pug-loader'] 
    }, 
    ] 
}

不會得到通過的WebPack再處理的哈巴狗文件的例子。

this.$mdDialog.show({ 
    clickOutsideToClose: true, 
    template: require('../components/ui/client.pug'), 
    controller: ['$mdDialog', '$state', '$rootScope', 'clientService', ProfilePopupController], 
    controllerAs: 'dm', 
    bindToController: true, 
    locals: { localData: popupData } 
})

我試圖明確提及哈巴狗裝載機使用

template: require('pug-loader!../components/ui/client.pug');

這哈巴狗裝載機文檔中的例子相匹配的Github pug-loader repository

template = require("pug-loader!./file.pug");

這給了我錯誤：

ERROR in ./~/pug-loader!./src/app/components/ui/client.pug Module build failed: Error: C:\Users\User\git\myapp\node_modules\pug-loader\index.js!C:\git\myapp\src\app\components\ui\client.pug:4:1

我有一個小應用程序顯示問題的Github。它在MyApp Repository。如果您構建這個應用程序，您可以看到在main.controller.ts aboutPopup()中引用的模板pug文件顯示部分處理的代碼。一旦建成，轉到Main並單擊關於按鈕。

來源

2017-03-20 TSW

我通過挖掘發現了一個解決方案。通過從pug-loader，這顯然不會自動找到帕格參考內控制器，pug-html-loader切換這是一個關鍵的一步。我曾嘗試過，但只是得到了未經處理的HTML，所以放棄了它。

然後我找到了一個參考，將html-loader作爲第二個加載器。所以，現在我已經改變了我的配置在rules部分：

{ 
    test: /\.pug$/, 
    use: [ 
    'html-loader', 
    'pug-html-loader' 
    ] 
}

這讓一切過程，並建立罰款。

來源

2017-03-21 02:27:00 TSW

Webpack不處理控制器模板中的帕格文件

回答

相關問題