รวมคำสั่ง Ember js

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 ให้ถูกต้อง.

ใส่ความเห็น

อีเมลของคุณจะไม่แสดงให้คนอื่นเห็น ช่องข้อมูลจำเป็นถูกทำเครื่องหมาย *

คุณอาจใช้แท็กHTMLและแอททริบิวต์เหล่านี้: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>