开发工具采用WebStorm,没破解,使用了过期策略:安装之后不着急打开程序,先设置系统日期为未来的某个日期,比如2020年。然后再打开程序,试用。然后再改回来系统日期。虽然每次打开WebStorm都会提示:

不过不影响使用,点击“OK”继续吧。

项目采用anguarjs seed项目作为基础框架,搭建完成之后如下:

.bowerrc的配置如下:

{ "directory": "app/lib"}

3. app中的各view拆分成不同的目录存放,如下:

4. 接下来是依赖的第三方库导入,bower install --save 库名

用到的几个:

angular-local-storage : 本地存储,如果不支持localstore,自动切换为cookie

angular-summernote : 简易的富文本编辑,界面引用简单,记着在app.js中注册“summernote”

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

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'
    }
  }
});
fis-config.js

6.样式模板,选了几个基于angulajs bootstrap的开源项目,感觉不错的两个个

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

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

以上这篇Angularjs---项目搭建图文教程就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持Devmax。

Angularjs---项目搭建图文教程的更多相关文章

  1. AngularJs上传前预览图片的实例代码

    使用AngularJs进行开发,在项目中,经常会遇到上传图片后,需在一旁预览图片内容,怎么实现这样的功能呢?今天小编给大家分享AugularJs上传前预览图片的实现代码,需要的朋友参考下吧

  2. AngularJS中下拉框的高级用法示例

    这篇文章主要介绍了AngularJS中下拉框的高级用法,结合实例形式分析了AngularJS下拉框的遍历、选择、绑定、显示等功能实现方法,需要的朋友可以参考下

  3. AngularJS数据源的多种获取方式汇总

    在AngularJS中获取数据源的方式有很多种,本文给大家整理几种获取数据源的方式,对angularjs获取数据源的方式相关知识感兴趣的朋友一起学习吧

  4. 带你一步步从零搭建一个Vue项目

    Vue.js是现在比较优秀的Web前端框架,非常推荐大家入门学习,这篇文章主要给大家介绍了关于如何一步步从零搭建一个Vue项目的相关资料,文中通过图文以及实例代码介绍的非常详细,需要的朋友可以参考下

  5. swiper在angularjs中使用循环轮播失效的解决方法

    今天小编就为大家分享一篇swiper在angularjs中使用循环轮播失效的解决方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

  6. Koa项目搭建过程详细记录

    本篇文章主要介绍了Koa项目搭建过程详细记录,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  7. AngularJS教程之环境设置

    本文主要介绍AngularJS环境设置,学习AngularJS的朋友肯定要设置开发软件的环境,这里详细介绍安装设置流程,有需要的朋友可以参考下

  8. 详解AngularJs中$resource和restfu服务端数据交互

    之前小编和大家分享过使用$http同服务器进行通信,但是功能上比较简单,angularjs还提供了另外一个可选的服务$resource,使用它可以非常方便的同支持restful的服务单进行数据交互。下面来一起看看吧。

  9. angularJS模态框$modal实例代码

    本篇文章主要介绍了angularJS模态框$modal实例代码,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  10. 详解angular ui-grid之过滤器设置

    本篇文章主要介绍了详解angular ui-grid之过滤器设置,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

随机推荐

  1. Error: Cannot find module ‘node:util‘问题解决

    控制台 安装 Vue-Cli 最后一步出现 Error: Cannot find module 'node:util' 问题解决方案1.问题C:\Windows\System32>cnpm install -g @vue/cli@4.0.3internal/modules/cjs/loader.js:638 throw err; &nbs

  2. yarn的安装和使用(全网最详细)

    一、yarn的简介:Yarn是facebook发布的一款取代npm的包管理工具。二、yarn的特点:速度超快。Yarn 缓存了每个下载过的包,所以再次使用时无需重复下载。 同时利用并行下载以最大化资源利用率,因此安装速度更快。超级安全。在执行代码之前,Yarn 会通过算法校验每个安装包的完整性。超级可靠。使用详细、简洁的锁文件格式和明确的安装算法,Yarn 能够保证在不同系统上无差异的工作。三、y

  3. 前端环境 本机可切换node多版本 问题源头是node使用的高版本

    前言投降投降 重头再来 重装环境 也就分分钟的事 偏要折腾 这下好了1天了 还没折腾出来问题的源头是node 使用的高版本 方案那就用 本机可切换多版本最终问题是因为nodejs的版本太高,导致的node-sass不兼容问题,我的node是v16.14.0的版本,项目中用了"node-sass": "^4.7.2"版本,无法匹配当前的node版本根据文章的提

  4. nodejs模块学习之connect解析

    这篇文章主要介绍了nodejs模块学习之connect解析,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  5. nodejs npm package.json中文文档

    这篇文章主要介绍了nodejs npm package.json中文文档,本文档中描述的很多行为都受npm-config(7)的影响,需要的朋友可以参考下

  6. 详解koa2学习中使用 async 、await、promise解决异步的问题

    这篇文章主要介绍了详解koa2学习中使用 async 、await、promise解决异步的问题,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  7. Node.js编写爬虫的基本思路及抓取百度图片的实例分享

    这篇文章主要介绍了Node.js编写爬虫的基本思路及抓取百度图片的实例分享,其中作者提到了需要特别注意GBK转码的转码问题,需要的朋友可以参考下

  8. CentOS 8.2服务器上安装最新版Node.js的方法

    这篇文章主要介绍了CentOS 8.2服务器上安装最新版Node.js的方法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  9. node.js三个步骤实现一个服务器及Express包使用

    这篇文章主要介绍了node.js三个步骤实现一个服务器及Express包使用,文章通过新建一个文件展开全文内容,具有一定的参考价值,需要的小伙伴可以参考一下

  10. node下使用UglifyJS压缩合并JS文件的方法

    下面小编就为大家分享一篇node下使用UglifyJS压缩合并JS文件的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

返回
顶部