搜尋此網誌

2016-08-16

FrontEnd Note

撰寫中

安裝開發環境 安裝 Node.js
npm 模块安装机制简介
安裝 Yarn
用 Yarn 取代 Npm 管理 JavaScript 套件版本
Yarn vs npm:你需要知道的一切
CLI commands comparison

參考 Using a package.json, 產生 package.json, 在專案目錄
npm init

套件安裝語法
安裝在全域
npm install -g jshint package_name
安裝為實際上線使用
npm install package_name --save
安裝為開發或測試使用
npm install package_name --save-dev

安裝 Yeoman,樣版產生器
npm install -g yo
安裝 Bower,套件管理員
npm install -g bower
安裝 Glup,專案建置工具
npm install --g gulp-cli
npm 與 Bower 的差異可見:
What is the difference between Bower and npm?
What’s the difference between Bower and NPM?
故,前瑞的套件可使用 Bower 安裝,開發工具則使用 npm 安裝
安裝 Karma,自動化測試工具
npm install --g karma karma-cli

安裝 TypeScript
npm install -g typescript

//npm install -g tsd //改用 typings
//npm install -g typings //TypeScript 2.0 己不使用
npm install --save @types/jquery

安裝 phantomjs
npm install phantomjs-prebuilt -g

npm 移除套件清除快取
npm uninstall -g packageName
npm cache clear


Yeoman 快速入門 Let's Scaffold a Web App with Yeoman

安裝 樣版產生器,安裝前要注意下樣版說明

安裝樣版 HTML5 Boilerplate generator
npm install --global generator-h5bp
建立一個新資料夾,產生新網站
yo h5bp
安裝樣版 karma
npm install -g generator-karma
安裝樣版 angular
npm install -g generator-angular
建立一個新資料夾,產生新網站
yo angular [app-name]


NPM 說明文件,先參考 Getting Started 的內容

參考 05 - Using a `package.json`,產生 package.json ,用來記錄安裝的 Node.js 套件
npm init
還原 package.json 裡面有記錄的 Node.js 套件
npm install
安裝的套件檔會存放在 node_modules 裡面


Bower 產生記錄安裝套件的 bower.json
bower init
還原 bower.json 裡面有記錄的套件
bower install
安裝的套件檔會存放在 bower_components 裡面

Configuration
bower 的設定檔 .bowerrc


Gulp 在專案根目錄下建立 gulpfile.js
var gulp = require('gulp');

gulp.task('default', function() {
  // place code for your default task here
});
gulp-google-cdn


TypeScript 產生 tsconfig.json
tsc --init

安裝定義檔
TypeSearch
關於 TypeScript 2.0 之後的模組定義檔 ( Declaration Files ) ( *.d.ts )

npm install --save @types/jquery


以下內容已淘汰

typings 從 TypeScript 2.0 也被淘汰

DefinitelyTyped

tsd 據說已淘汰,改用 typings
加入 TypeScript Definition
參考 如何用 Visual Studio Code 開發 AngularJS 應用程式,讓 VS Code 有完整智慧提示
安裝 TypeScript
tsd init
tsd install jquery --save
tsd install bootstrap --save
tsd install angularjs/ --save
tsd install angular-ui-bootstrap --save

Typings TypeScript Definition Manager
產生 typings.json
typings init

安裝定義檔
//typings install [pkgsource]~[pkgname]@[ver]
typings install dt~jquery --save --global

還原定義檔
typings install



Visual Studio Code JavaScript
安裝 jsconfig-gen,jsconfig.json 產生器
//安裝
npm install -g jsconfig-gen
產生 jsconfig.json,在專案目錄
jsconfig [...path]
gulp-google-cdn


沒有留言: