Home > Developer > Web Develop
This is the first time to pause the next blog-you draw my guess the progress, because in this game, want to use the latest NG2 technology, but the pit is a piece after another, this way first introduced the environment deployment and pits history
Since to use NG2, first to get resources, I use the AngularJs2 beta version of the online resources have two kinds, One is a fully compressed version of the file. Min.js version of the other is a lot of messy JS files, mainly ng2 has been fully adopted typescript, coupled with support for ES6, so need to introduce a lot of compatibility, compile files
This side just special hand owe want to learn gulp, so open to configure Gulp environment, compress all the JS file into a min.js file
varGulp = require ("Gulp"), Concat= Require ("Gulp-concat"), Uglify= Require ("Gulp-uglify"); Gulp.task ("Default",function(){ returnGULP.SRC (["Src/angular2-polyfills.js", "Src/system.js", "Src/typescript.js", "Src/rx.js", "Src/angular2.dev.js", "Src/http.dev.js", "Src/router.dev.js", "Src/tsloader.js", "Src/system.config.js"]). Pipe (Concat ("Angular2.beta.stack.min.js") . Pipe (Uglify ()). Pipe (Gulp.dest ("Dist"));});
Finish gulp, and grunt play again, have to say things must have its existence of truth, rich library support to grunt huge use of the market, and gulp syntax streamlining, learning cycle also greatly shortened so that it has greater prospects, tut, used up on two words, cool!
Broken read, began to talk about Express+io.socket configuration, Socket.io configuration is not much to say, in the last you draw my guess is very clear, the portal, this way I introduce the reason why Express module, only one: Route!!
Because the node configuration is very low-level, the route also needs to write itself, such as I access natureless:8100 is not a problem, because I configured in the Server.js Port point
var app = require (' http ' if (Err) {res.writehead ( 500 return res.end (' Error loading index.html ' ); } res.writehead ( 200); Res.end (data); });}And I want to access the index.html that appears with app.html as a sibling, by natureless.cn:8100/ index.html access is not valid because node gets the get data index.html he doesn't know what to do, needs to be manually configured, and at the beginning, my idea is to handle the req message, very patient fs.readfile (__dirname+ ' XX path '), but encounter degree Niang, know Express has specialized for static file access middleware express.static ()
App.use (express.static (' src '));So we can put our template in src, through our familiar relative path can be accessed, referencing the file, this side of the server to paste the code
varExpress=require (' Express ');varapp=Express ();varHTTP = require (' http '). Createserver (app);varIO = require (' Socket.io ') (HTTP);varFS = require (' FS '); App.use (Express.static (' SRC ')); App.get (‘/‘,function(req, res) {Res.sendfile (__dirname+ "/" + "app.html" );}) Http.listen (8100,function() {Console.log (' Natureless server begin ... ');}); Io.sockets.on (' Connection ',function(socket) {Socket.emit (' News ', {hello: ' World ' }); Socket.on (' Startconnect ',function(data) {Io.sockets.emit (' News ', data); });});
In fact, there are so many problems, mainly from the environment is node configuration, I introduced Ng2, as long as the path involved in the problem of various errors, such as Templateurl
Paste the app.html code below
<!DOCTYPE HTML><HTML><Head> <MetaCharSet= "Utf-8"> <title>Test</title> <Scripttype= "Text/javascript"src= "/js/angular2.beta.stack.min.js"></Script></Head><Body> <Ez-app></Ez-app> <Scripttype= "Text/typescript">Import {Component} from"Angular2/core"; Import {bootstrap} from"Angular2/platform/browser"; @Component ({selector:"Ez-app", Templateurl:'/view/gameroom.html'}) Class ezapp{} bootstrap (Ezapp); </Script></Body></HTML>
Card in Templateurl full three days, all kinds of mining pits, the most stupid problem over 8100 ports on the 80 port on the relative path, obviously across the domain, you draw my guess the main frame is done ..... Well, it's called a programming trip, I'm called pits trip ah, haha
Node learning Note (iv): Gulp+express+io.socket deployment AngularJs2 (pits)
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
