## 創建項目骨架
創建一個基于單模塊的項目框架
### 安裝 ThinkJS 命令
~~~sh
$ npm install -g think-cli
~~~
安裝完成后,系統中會有`thinkjs`命令(可以通過`thinkjs -V`查看 think-cli 的版本號,此版本號非 thinkjs 的版本號)。如果找不到這個命令,請確認環境變量是否正確。
### 創建項目
執行`thinkjs new [project_name]`來創建項目,如:
~~~
$ thinkjs new cms-server-thinkjs
$ cd cms-server-thinkjs
$ npm install
$ npm start
~~~
在詢問是否打開Babel的時候選擇是,開啟Babel,其他的選擇默認值就可以了。
```
PS D:\在線課程\JS與WEB前端框架技術\web-js-framework-code\code\projects\cms\module-01\learning> thinkjs new cms-server-thinkjs
? Project name cms-server-thinkjs
? Project description application created by thinkjs
? Author zengqs <pypzengqs@126.com>
? Do you want to turn on babel? Yes
think-cli · Generated cms-server-thinkjs
To get started:
# enter path
$ cd cms-server-thinkjs
# install dependencies:
$ npm install
# run the app
$ npm start
```
package.json文件內容
~~~
{
"name": "cms-server-thinkjs",
"description": "application created by thinkjs",
"version": "1.0.0",
"author": "",
"scripts": {
"start": "node development.js",
"test": "THINK_UNIT_TEST=1 nyc ava test/ && nyc report --reporter=html",
"compile": "babel --no-babelrc src/ --presets think-node --out-dir app/",
"lint": "eslint src/",
"lint-fix": "eslint --fix src/"
},
"dependencies": {
"mockjs": "^1.1.0",
"think-cache": "^1.0.0",
"think-cache-file": "^1.0.8",
"think-logger3": "^1.0.0",
"think-model": "^1.0.0",
"think-model-mysql": "^1.0.0",
"think-session": "^1.0.0",
"think-session-file": "^1.0.5",
"think-view": "^1.0.0",
"think-view-nunjucks": "^1.0.1",
"thinkjs": "^3.0.0"
},
"devDependencies": {
"babel-cli": "^6.24.1",
"babel-preset-think-node": "^1.0.0",
"node-notifier": "^5.0.2",
"think-inspect": "0.0.2",
"think-babel": "^1.0.3",
"think-watcher": "^3.0.0",
"eslint": "^4.2.0",
"eslint-config-think": "^1.0.0",
"ava": "^0.18.0",
"nyc": "^7.0.0"
},
"repository": "",
"license": "MIT",
"engines": {
"node": ">=6.0.0"
},
"readmeFilename": "README.md",
"thinkjs": {
"metadata": {
"name": "cms-server-thinkjs",
"description": "application created by thinkjs",
"author": "",
"babel": true
},
"projectName": "cms-server-thinkjs",
"template": "C:\\Users\\jszx\\AppData\\Roaming\\npm\\node_modules\\think-cli\\default_template",
"clone": false,
"isMultiModule": false
}
}
~~~
- 文檔說明
- 服務端開發指南
- 客戶端開發指南
- 請求攔截器
- API接口實例分析
- 頁面文件
- NPM包管理
- 創建NPM包項目
- 課程設計
- 概述
- 內容管理系統項目
- 配置開發環境
- 設計靜態原型
- 快速構建項目
- 構建CMS系統前端界面
- 門戶模塊
- 新聞列表
- API接口規范
- 生成模擬數據
- 顯示新聞列表
- NavigatorPath組件
- ChannelHeader組件
- v-line-clamp指令
- formatDate過濾器
- 新聞詳情頁
- 修改頂部導航菜單
- 實現訪問遠程API
- 擴展功能
- 組件開發
- 服務端項目
- 編寫服務模塊
- 項目配置
- 數據庫
- 創建數據庫腳本
- 配置數據庫
- 創建模擬數據
- 新聞模塊控制器
- 添加邏輯驗證層
- 實現接口
- 書棧模塊
- QA