typescript：使用typescript和webpack解析typeahead.js 2

我從webpack收到以下錯誤。typescript：使用typescript和webpack解析typeahead.js 2

ERROR in ./wwwroot/js/admin/infrastructure/typeaheadComponent.ts Module not found: Error: Can't resolve 'typeahead' in ...

我有以下安裝

npm install typeahead.js 
npm install @types/typeahead

我的打字稿如下所示，使用node模塊分辨率。

import { module } from "angular"; 
import "typeahead"; 
// necessary to import typeahead into JQuery, as otherwise 
// typeahead below is not defined. 

class TypeAheadController { 
    foo(e) { 
     $(e).typeahead(...) 
    } 
}

這個如下生成JavaScript：

"use strict"; 
var angular_1 = require("angular"); 
require("typeahead"); 
var TypeAheadController = (function() { ...

我webpack.config.js如下：

module.exports = { 
    context: __dirname, 
    entry: [ 
     "./app.ts", 
     "./tab.ts", 
     "./client/clientService.ts", 
     "./client/clientSearchComponent.ts", 
     "./infrastructure/messageComponent.ts", 
     "./infrastructure/typeaheadComponent.ts", 
     "./url.ts"], 
    output: { 
     filename: "./wwwroot/js/admin/admin.js" 
    }, 
    devtool: "source-map", 
    module: { 
     rules: [ 
      { test: /\.ts$/, use: 'ts-loader' } 
     ] 
    } 
};

導入一飲而盡任務。

如何指定typeahead位於node_modules/typeahead.js/dist/typeahead.bundle.js

來源

2017-03-28 Jim

你可以使用別名來解決這個問題。

module.exports = { 
    /* ... everything you currently have */ 
    resolve: { 
    alias: { 
     typeahead: 'typeahead.js' 
    } 
    } 
}

來源

2017-03-31 14:20:06

它解決了部分問題，typeahead.js文件在被組件使用後包含在輸出中，因此整個導入仍然被破壞，並且需要我手動包含typeahead.js文件。 – Jim

該模塊被稱爲typeadhead.js，所以你還需要進口typeahead.js，不typeahead。

import "typeahead.js";

導入總是與您用npm安裝它的名稱相同。它甚至不是特別的，它簡單地查看node_modules並找到具有給定名稱的目錄。然後它會查看package.json並導入main field中指定的文件。另見Node.js - Folders as Modules。

您可以使用resolve.alias來更改導入的名稱，但在這種情況下沒有很好的理由這麼做。

來源

2017-03-28 21:19:00

這不工作，當我改變'進口「預輸入」''到進口「typeahead.js」'打字稿編譯器失敗，'財產預輸入：在你的webpack.config.js要改變什麼小例子，在類型JQuery'上不存在，正如我在問題中所解釋的那樣，導入是必需的，因爲類型定義在typeahead中，而不是typeahead.js – Jim

另外，如果我使用'import「typeahead.js」'，webpack包含文件在輸出中，但變量'Bloodhound'沒有被定義，所以當文件被包含在輸出中時，其中的類型不能在javascript中訪問。 – Jim

typescript：使用typescript和webpack解析typeahead.js 2

回答

相關問題