2016-07-04 3 views
5
angular-cli: 0.0.39 
node: 6.2.2 
os: win32 x64 

Я пытался импортировать socket.io-client в angular2 приложения генерируемое с angular-cli, но я не могу заставить его работать.Angular2 CLI Socket.io (третий импорт партии библиотека)

chat.component.ts

import * as io from "socket.io-client"; 

@Component({ 
    ... 
}) 
export class ChatAppComponent { 
    ... 
} 

система-config.ts

/** Map relative paths to URLs. */ 
const map: any = { 
    "socket.io-client": "vendor/socket.io-client/socket.io.js" 
}; 

/** User packages configuration. */ 
const packages: any = { 
    "socket.io-client": {"defaultExtension": "js"} 
}; 

радиально-CLI-build.js

var Angular2App = require('angular-cli/lib/broccoli/angular2-app'); 

module.exports = function(defaults) { 
    return new Angular2App(defaults, { 
    vendorNpmFiles: [ 
     'systemjs/dist/system-polyfills.js', 
     'systemjs/dist/system.src.js', 
     'zone.js/dist/*.js', 
     'es6-shim/es6-shim.js', 
     'reflect-metadata/*.js', 
     'rxjs/**/*.js', 
     '@angular/**/*.js', 
     'socket.io-client/socket.io.js' 
    ] 
    }); 
}; 

package.json

{ 
     "dependencies": { 
     ... 
     "socket.io-client": "^1.4.8", 
     "systemjs": "0.19.26" 
     }, 
     "devDependencies": { 
     ... 
     "typescript": "^1.8.10", 
     "typings": " 
     } 
} 

typings.json

{ 
    "ambientDevDependencies": { 
    "angular-protractor": "registry:dt/angular-protractor#1.5.0+20160425143459", 
    "jasmine": "registry:dt/jasmine#2.2.0+20160412134438", 
    "selenium-webdriver": "registry:dt/selenium-webdriver#2.44.0+20160317120654" 
    }, 
    "ambientDependencies": { 
    "es6-shim": "registry:dt/es6-shim#0.31.2+20160317120654", 
    }, 
    "globalDependencies": { 
    "socket.io-client": "registry:dt/socket.io-client#1.4.4+20160317120654" 
    } 
} 

Ошибка и StackTrace

Error: Typescript found the following errors: 
    C:/Users/Christian/Desktop/prototypes/chat-client/tmp/broccoli_type_script_compiler-input_base_path-5WNagLgm.tmp/0/src/app/chat.component.ts (4, 21): Cannot find module 'socket.io-client'. 
    at BroccoliTypeScriptCompiler._doIncrementalBuild (C:\Users\Christian\Desktop\prototypes\chat-client\node_modules\angular-cli\lib\broccoli\broccoli-typescript.js:115:19) 
    at BroccoliTypeScriptCompiler.build (C:\Users\Christian\Desktop\prototypes\chat-client\node_modules\angular-cli\lib\broccoli\broccoli-typescript.js:43:10) 
    at C:\Users\Christian\Desktop\prototypes\chat-client\node_modules\angular-cli\node_modules\broccoli-caching-writer\index.js:152:21 
    at lib$rsvp$$internal$$tryCatch (C:\Users\Christian\Desktop\prototypes\chat-client\node_modules\angular-cli\node_modules\broccoli-caching-writer\node_modules\rsvp\dist\rsvp.js:1036:16) 
    at lib$rsvp$$internal$$invokeCallback (C:\Users\Christian\Desktop\prototypes\chat-client\node_modules\angular-cli\node_modules\broccoli-caching-writer\node_modules\rsvp\dist\rsvp.js:1048:17) 
    at lib$rsvp$$internal$$publish (C:\Users\Christian\Desktop\prototypes\chat-client\node_modules\angular-cli\node_modules\broccoli-caching-writer\node_modules\rsvp\dist\rsvp.js:1019:11) 
    at lib$rsvp$asap$$flush (C:\Users\Christian\Desktop\prototypes\chat-client\node_modules\angular-cli\node_modules\broccoli-caching-writer\node_modules\rsvp\dist\rsvp.js:1198:9) 
    at _combinedTickCallback (internal/process/next_tick.js:67:7) 
    at process._tickCallback (internal/process/next_tick.js:98:9) 

ответ

1

Является ли этот файл присутствует node_modules/socket.io-client/socket.io.js.

Проверить файл dts присутствует в папке typings для сокета-иона.

Поскольку вы уже указали расширение в map, не нужно указывать его повторно в defaultExtension из package.
Попытка добавления format: 'cjs' ИЛИ format: 'amd' на основе библиотеки в package -> socket.io-client

+0

'chat-client \ node_modules \ socket.io-client \ socket.io.js' присутствует. 'chat-client \ typings \ globals \ socket.io-client \ index.d.ts' также. Я изменил формат в 'src/system-config.ts' на' cjs', все еще не работающий: C – Chris

0

системы-config.ts

/** Map relative paths to URLs. */ 
const map: any = { 
    "socket.io-client": "vendor/socket.io-client/" 
}; 

/** User packages configuration. */ 
const packages: any = { 
    "socket.io-client": { 
    format: 'cjs', 
    defaultExtension: 'js', 
    main: 'socket.io.js' 
} 
}; 

угловой CLI-build.js

module.exports = function(defaults) { 
    return new Angular2App(defaults, { 
    vendorNpmFiles: [ 
     'socket.io*/**/*.js' 
    ] 
    }); 
}; 

работает как charm angular-cli: "1.0.0-beta.10"

0

Это работает для меня:

npm install --save @types/socket.io-client 
+0

@axiac Ответ на код, возможно, не очень хороший, но он по-прежнему остается ответом. Я бы порекомендовал вам эту запись о LQPRQ: [Вы делаете это неправильно: призыв к здравомыслию в очереди с низким качеством сообщений] (http://meta.stackoverflow.com/questions/287563/youre-doing-it- неправильно-a-plea-for-sanity-in-the-low-quality-posts-queue) – FelixSFD

+0

@FelixSFD вы правы. Я не уделял достаточного внимания содержанию ответа и имел впечатление, что это один из тех ответов, которые говорят о том, что вопрос в вопросе не может быть воспроизведен. Теперь я внимательно прочитал вопрос, и этот ответ кажется действительным, даже если он короткий. – axiac

3

1) Установите socket.io-клиент

npm install socket.io-client --save 

2) Установка socket.io-клиента типизации

npm install @types/socket.io-client --save-dev 

3) Импорт гнездо .io-client в вашем приложении/код

import * as io from "socket.io-client"; 
+1

Работал как шарм, спасибо! – totallytotallyamazing