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

ho cercato di importare socket.io-client in un app angular2 generato con il angular-cli ma non riesco a farlo funzionare.Angular2 CLI Socket.io (3 ° import Biblioteca Party)

chat.component.ts

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

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

system-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"} 
}; 

angolari-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" 
    } 
} 

errore e 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) 

risposta

1

E 'questo file presente node_modules/socket.io-client/socket.io.js.

Controllare il file dts nella cartella typings per socket-io.

Poiché l'estensione è stata già specificata in map, non è necessario specificarla di nuovo in defaultExtension di package.
Prova ad aggiungere format: 'cjs' O format: 'amd' basato sulla libreria nei package -> socket.io-client

+0

'chat-client \ node_modules \ socket.io-client \ socket.io.js' è presente. 'chat-client \ typings \ globals \ socket.io-client \ index.d.ts' anche. Ho cambiato il formato in 'src/system-config.ts' a' cjs', ancora non funzionante: C – Chris

0

system-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' 
} 
}; 

angolari-CLI-build.js

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

lavoro come un charm angular-cli: "1.0.0-beta.10"

0

questo funziona per me:

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

@axiac Una risposta di solo codice potrebbe non essere buona, ma è comunque una risposta. Ti consiglierei questo post sul LQPRQ: [Stai sbagliando: una richiesta di sanità mentale nella coda Messaggi di bassa qualità] (http://meta.stackoverflow.com/questions/287563/youre-doing-it- sbagliato-a-plea-for-sanity-in-the-low-quality-posts-queue) – FelixSFD

+0

@FelixSFD hai ragione. Non ho prestato abbastanza attenzione al contenuto della risposta e ho avuto l'impressione che sia una di quelle risposte che dicono che il problema nella domanda non può essere riprodotto. Ho letto la domanda con più attenzione ora e questa risposta sembra valida, anche se è breve. – axiac

3

1) Installare socket.io-client

npm install socket.io-client --save 

2) Installare tipizzazioni socket.io-client

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

3) Presa Import .io-client nella tua app/codice

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

Ha funzionato come un incantesimo, grazie! – totallytotallyamazing

Problemi correlati