Angularjs-項目搭建

開發工具採用WebStorm,沒破解,使用了過時策略:安裝以後不着急打開程序,先設置系統日期爲將來的某個日期,好比2020年。而後再打開程序,試用。而後再改回來系統日期。雖然每次打開WebStorm都會提示:css

不過不影響使用,點擊「OK」繼續吧。jquery

 

項目採用anguarjs seed項目做爲基礎框架,搭建完成以後以下:git

.bowerrc的配置以下:github

{
  "directory": "app/lib" }

3. app中的各view拆分紅不一樣的目錄存放,以下:bootstrap

4. 接下來是依賴的第三方庫導入,bower install --save 庫名cookie

用到的幾個:app

angular-local-storage : 本地存儲,若是不支持localstore,自動切換爲cookie框架

angular-summernote : 簡易的富文本編輯,界面引用簡單,記着在app.js中註冊「summernote」dom

<summernote height="300" lang="zh-CN"></summernote>ide

angular-base64和angular-md5 加解密

bootstrap 樣式必然是這個

bootstrap-fileinput 圖片上傳,支持上傳便可預覽

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' } } });
複製代碼

6.樣式模板,選了幾個基於angulajs+bootstrap的開源項目,感受不錯的兩個個

AdminLTE:git://github.com/almasaeed2010/AdminLTE.git

charisma:https://github.com/usmanhalalit/charisma/archive/master.zip

disappearwind

相關文章
相關標籤/搜索