Angularjs---項(xiàng)目搭建圖文教程
開(kāi)發(fā)工具采用WebStorm，沒(méi)破解，使用了過(guò)期策略：安裝之后不著急打開(kāi)程序，先設(shè)置系統(tǒng)日期為未來(lái)的某個(gè)日期，比如2020年。然后再打開(kāi)程序，試用。然后再改回來(lái)系統(tǒng)日期。雖然每次打開(kāi)WebStorm都會(huì)提示：
不過(guò)不影響使用，點(diǎn)擊“OK”繼續(xù)吧。
項(xiàng)目采用anguarjs seed項(xiàng)目作為基礎(chǔ)框架，搭建完成之后如下：
.bowerrc的配置如下：
{ "directory": "app/lib"}
3. app中的各view拆分成不同的目錄存放，如下：
4. 接下來(lái)是依賴(lài)的第三方庫(kù)導(dǎo)入，bower install --save 庫(kù)名
用到的幾個(gè)：
angular-local-storage ： 本地存儲(chǔ)，如果不支持localstore，自動(dòng)切換為cookie
angular-summernote ： 簡(jiǎn)易的富文本編輯，界面引用簡(jiǎn)單，記著在app.js中注冊(cè)“summernote”
<summernote height="300" lang="zh-CN"></summernote>
angular-base64和angular-md5 加解密
bootstrap 樣式必然是這個(gè)
bootstrap-fileinput 圖片上傳，支持上傳即可預(yù)覽
5. 配置打包的fis-config.js
// 包含所有文件
fis.config.set('project.include', '**');
// 排除目錄
fis.config.set('project.exclude', /^\/lib\/.*\/src\//i);
// 加載pack
fis.config.set('modules.postpackager', 'simple');
fis.config.set('pack', {
'js/application.js': [
'/lib/angular/angular.min.js',
'/lib/angular-route/angular-route.min.js',
'/lib/jquery/dist/jquery.min.js',
'/js/app.js',
'/js/controllers.js',
'/js/directives.js',
'/js/filters.js',
'/js/services.js'
],
'css/application.css': [
'/lib/bootstrap/dist/css/bootstrap.min.css',
'lib/font-awesome/css/font-awesome.min.css',
'/css/**.css'
]
});
fis.config.merge({
roadmap : {
domain : {
'**.css' : '/ocs',
'**.js' : '/ocs',
'**.eot' : '/ocs',
'**.ttf' : '/ocs',
'**.woff' : '/ocs',
'**.woff2' : '/ocs'
}
}
});
fis-config.js
6.樣式模板，選了幾個(gè)基于angulajs+bootstrap的開(kāi)源項(xiàng)目，感覺(jué)不錯(cuò)的兩個(gè)個(gè)
AdminLTE：git://github.com/almasaeed2010/AdminLTE.git
charisma：https://github.com/usmanhalalit/charisma/archive/master.zip
以上這篇Angularjs---項(xiàng)目搭建圖文教程就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
Node.js是一個(gè)基于chrome?v8引擎的JavaScript運(yùn)行時(shí)環(huán)境,用于構(gòu)建快速、可擴(kuò)展的網(wǎng)絡(luò)應(yīng)用程序,在某些情況下,降級(jí)Node.js版本可能額是必要的,本篇文章將向您介紹如今降級(jí)Node.js版本并提供相應(yīng)的源代碼示例,需要的朋友可以參考下2023-11-11
pm2工具在Node.js開(kāi)發(fā)部署中的重要作用詳解
這篇文章主要為大家介紹了pm2工具在Node.js開(kāi)發(fā)部署中的重要作用詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-12-12
CentOS 8.2服務(wù)器上安裝最新版Node.js的方法
這篇文章主要介紹了CentOS 8.2服務(wù)器上安裝最新版Node.js的方法，本文給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-12-12
又到了一年的面試季，今年情況特殊，很多人可能都窩在家里，也有一些人準(zhǔn)備找工作，但是疫情嚴(yán)重，也沒(méi)企業(yè)發(fā)招聘信息。這個(gè)時(shí)候，最好的做法就是在家里刷面試題2020-02-02
node.js使用express框架進(jìn)行文件上傳詳解
在本篇內(nèi)容里小編給大家整理了關(guān)于node.js使用express框架進(jìn)行文件上傳的相關(guān)知識(shí)點(diǎn)內(nèi)容，有需要的朋友們跟著學(xué)習(xí)下。2019-03-03
這篇文章主要介紹了node.js中的socket.io的廣播消息,需要的朋友可以參考下2014-12-12
手把手教你VSCode配置JavaScript基于Node.js的調(diào)試環(huán)境
最近在補(bǔ)數(shù)據(jù)結(jié)構(gòu),在用VScode調(diào)試js代碼文件結(jié)果怎么都不行,這篇文章主要給大家介紹了關(guān)于VSCode配置JavaScript基于Node.js的調(diào)試環(huán)境的相關(guān)資料,需要的朋友可以參考下2022-12-12
基于Node-red的在線評(píng)語(yǔ)系統(tǒng)(可視化編程,公網(wǎng)訪問(wèn))
Node-Red是IBM公司開(kāi)發(fā)的一個(gè)可視化的編程工具，在網(wǎng)頁(yè)內(nèi)編程，主要是拖拽控件，代碼量很小,這篇文章主要介紹了基于Node-red的在線評(píng)語(yǔ)系統(tǒng)(可視化編程,公網(wǎng)訪問(wèn)),需要的朋友可以參考下2022-01-01
nodejs不用electron實(shí)現(xiàn)打開(kāi)文件資源管理器并選擇文件
最近在開(kāi)發(fā)一些小腳本,用 nodejs 實(shí)現(xiàn),其中很多功能需要選擇一個(gè)/多個(gè)文件,或者是選擇一個(gè)文件夾,這種情況下網(wǎng)上給出的解決方案都是 electron,但是我一個(gè)小腳本用 electron 屬實(shí)有點(diǎn)夸張了,后來(lái)轉(zhuǎn)念一想可以通過(guò) powershell 來(lái)實(shí)現(xiàn)類(lèi)似的功能,需要的朋友可以參考下2024-01-01
nodejs 搭建簡(jiǎn)易服務(wù)器的圖文教程(推薦)
下面小編就為大家?guī)?lái)一篇nodejs 搭建簡(jiǎn)易服務(wù)器的圖文教程(推薦)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-07-07