Ember.js คือ front-end framework ตัวหนึ่งที่เขียนง่าย เรียนรู้ง่าย ใช้เวลาไม่มาก และทำงานได้จริง. การจะติดตั้ง Ember ให้ติดตั้ง npm ซึ่งจะมากับ node.js และขอแนะนำให้ติดตั้ง bower เพิ่มด้วยอีกตัวหนึ่ง. ในบทความนี้จะรวมคำสั่งของ Ember และคำสั่งของโปรแกรมอื่นๆที่จะต้องใช้งานร่วมกัน เช่น node.js (npm).
เริ่มโปรเจ็คใหม่
การติดตั้งเพื่อเริ่มใช้งาน ให้พิมพ์คำสั่ง npm install -g ember-cli@2.14 จากนั้นตามด้วย ember new myapp โดย myapp คือชื่อโฟลเดอร์และโปรเจ็คที่เราจะเริ่มทำงาน.
สำหรับรายละเอียดเพิ่มเติมโปรดอ่านได้ใน quick start จากเว็บของ ember โดยตรงซึ่งจะมีเวอร์ชั่นที่อัพเดทและรวมถึงการเริ่มหัดเขียน.
เริ่มจากโปรเจ็คที่มีอยู่
บางครั้งเมื่อเราทำงานโปรเจ็คหนึ่งๆ แล้วทำการแบ็คอัพไว้ เมื่อมีการติดตั้ง OS ใหม่หรือย้ายไฟล์ไปทำงานที่เครื่องอื่นๆ ก็สามารถทำได้โดยการแบ็คอัพเฉพาะไฟล์และโฟลเดอร์ที่ไม่รวม bower_components และ node_modules เพราะทั้ง 2 โฟลเดอร์นี้เป็นเพียงที่เก็บแพ็คเกจต่างๆ ไม่ใช่ที่เก็บงานที่เราเขียน ซึ่งเราสามารถดาวน์โหลดแพ็คเกจต่างๆได้ในภายหลัง.
เมื่อแตกไฟล์ zip จากที่แบ็คอัพไว้แล้ว ให้เข้าไปในโฟลเดอร์ของโปรเจ็คนั้น แล้วรันคำสั่งต่อไปนี้.
npm cache clean หรืออาจใช้ npm cache verify --force
bower cache clean
npm install && bower install
ember init โดยหลังจากคำสั่งนี้อาจมีคำถามต่างๆ ให้เลือก d เพื่อดูความแตกต่าง, Y เพื่อเขียนทับ, N เพื่อไม่เขียนทับ
อัพเดทแพ็คเกจ
การอัพเดทแพ็คเกจต่างๆ สามารถทำได้โดยใช้คำสั่ง npm install --save-dev ชื่อแพ็คเกจ@รุ่น หรือแก้เลขรุ่นในไฟล์ bower.json, packages.json โดยตรง จากนั้นให้รันคำสั่งต่อไปนี้
npm cache clean หรืออาจใช้ npm cache verify --force
bower cache clean
npm install && bower install
ember init
คำสั่งต่างๆสำหรับอัพเดทนั้นจะเหมือนกันกับตอนเริ่มโปรเจ็คที่มีอยู่ ต่างกันตรงที่มีการแก้ไขรุ่นของแพ็คเกจที่จะใช้. บางแพ็คเกจที่อาจเลิกรองรับไปแล้ว ต้องหาแพ็คเกจอื่นมาแทน.
ล้างแพ็คเกจที่ไม่ใช้
การเอาแพ็คเกจที่ไม่ใช้ออก หรือ uninstall นั้นสามารถทำได้โดยการแก้ไขที่ไฟล์ bower.json, packages.json โดยตรง. จากนั้นให้รันคำสั่ง bower prune && npm prune.
ติดตั้ง Addons
Ember นั้นมี Addons ต่างๆให้ใช้มากมายที่ Ember Observer การติดตั้งสามารถทำได้โดยค้นหา Addons ที่ต้องการแล้วพิมพ์คำสั่งติดตั้งชื่อ Addons นั้นๆ ตัวอย่างเช่น ember install ember-cli-jquery-ui.
ถอนการติดตั้ง Addons
การถอนการติดตั้งจะยุ่งยากหน่อย เพราะจะไม่มีคำสั่ง ember uninstall add-on-name มาให้. ให้ใช้คำสั่ง npm uninstall ชื่อaddon --save-dev แล้วตามด้วยคำสั่ง npm prune. ในบางกรณี Addon นั้นๆจะพ่วงติดตั้งแพ็คเกจใน bower มาด้วย ก็ต้องตามไปสั่งถอนการติดตั้งใน bower อีกโดยใช้คำสั่ง bower uninstall ชื่อแพ็คเกจ --save.
จากตัวอย่างติดตั้งด้านบนที่ติดตั้ง ember-cli-jquery-ui มันจะทำการติดตั้งแพ็คเกจ jquery-ui ใน bower มาด้วย ก็ใช้คำสั่งชุดนี้ถอนการติดตั้งทั้งหมด.
npm uninstall ember-cli-jquery-ui --save-dev
npm prune
bower uninstall jquery-ui --save
คำสั่งเฉพาะ Ember อื่นๆ
สร้าง route ember generate route ชื่อroute
ลบ route ember destroy route ชื่อroute
สร้างและเผยแพร่โปรเจ็ค สำหรับงานพัฒนา ใช้ ember build, สำหรับงานโปรดัคชั่น ใช้ ember build --environment=production, สำหรับอัพเดทอัตโนมัติ เหมาะกับงานพัฒนา ใช้ ember build --watch
รัน server ที่รองรับอัพเดทอัตโนมัติ เหมาะสำหรับงานพัฒนา ember server
Ember กับ error 404
บางท่านอาจพัฒนาเว็บกับคำสั่ง ember server แต่เมื่อทำการ build แล้วพบว่ามันเรียกไปหน้าอื่นๆไม่ได้ ขึ้น 404 error หรือไม่พบหน้าเว็บ ให้สร้างไฟล์ .htaccess ไว้ในโฟลเดอร์ public/ ของโปรเจ็ค โดยมีเนื้อหาต่อไปนี้.
Options +FollowSymLinks
RewriteEngine On
# If you get 404 error, uncomment and change the line below.
#RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . index.html [L]
จากนั้นให้ทดลองสั่ง build และนำไฟล์,โฟลเดอร์ใน dist/ ไปใช้อีกครั้ง. ซึ่งถ้าหากยังพบ 404 error อีก ให้แก้ไขตำแหน่ง RewriteBase ให้ถูกต้อง.
