紀錄安裝流程,沒有太多說明
gulp
用途 : 目前安裝gulp只是要使用sass跟gulp的webserver
- 安裝node.js
- cli 輸入:
npm install -g gulp
- cd 到專案目錄後輸入:
npm init
- 然後再輸入:
npm install gulp -save-dev
- 裝 gulp-webserver 輸入:
npm install gulp-webserver -save-dev
- 在專案目錄底下增加一個gulpfile.js, 內容為:
var gulp = require('gulp');
var webserver = require('gulp-webserver');
gulp.task('webserver', function() {
gulp.src('./app/')
.pipe(webserver({
port:1234,
livereload: true,
directoryListing: false,
open: true,
fallback: 'index.html'
}));
});
gulp.task('default',['webserver']);
- 在cli 輸入 gulp 就會執行了,也會開啟瀏覽器
sass
- 安裝ruby
- cli 安裝 gulp-sass 輸入:
npm install gulp-sass --save-dev
- 在 gulpfile.js (設定sass,css的目錄)
var gulp = require('gulp'), // 載入 gulp
gulpSass = require('gulp-sass'); // 載入 gulp-sass
gulp.task('styles', function () {
gulp.src('sass/style.sass') // 指定要處理的 Sass 檔案目錄
.pipe(gulpSass()) // 編譯 Sass
.pipe(gulp.dest('css')); // 指定編譯後的 css 檔案目錄
});
- 在cli 執行 gulp styles (styles指的是task的名字 )
ionic
- cli 安裝ionic
npm install -g ionic cordova
- 開個ionic的專案
ionic start 專案名
start的時候它會問說要挑哪個template
- cd 到專案目錄
cd 專案名
- 執行 輸入:
ionic serve
其他相關ionic文件