配置AngularJS项目运行环境的几个步骤

废话不多说,直接上步骤!

配置angularjs项目运行环境的几个步骤  
1--安装git,使用命令git --version;  
2--安装nodejs,下载地址:官网http://www.nodejs.org/download/,默认是安装在C:\Program Files\nodejs。使用命令node -v;  
   安装npm,由于nodejs已经集成了npm,所以此时npm已经安装好了。使用命令npm -v;  
3--安装Yeoman,包括yo,Grunt和Bower。  
    yeoman的目标是通过Grunt和Bower的包装为开发者创建一个易用的工作流,解决零散的依赖关系。  
    yo是脚手架工具,用于构建一个新的项目框架;  
    Grunt是项目的构建工具,一个用于开发任务自动化的命令行工具;  
    Bower是一个HTML、CSS、Javascript和图片等前端资源的包管理器,不再需要手动去下载scripts了;  
    npm install -g yo grunt-cli bower --registry=https://registry.npm.taobao.org
    npm install -- global yo  
    使用命令:yo --version && bower --version && grunt --version;  
    
    看看路径C:\Users\wangmingfeng\AppData\Roaming\npm 下是否有生成的文件和文件夹;  (其实就是查看指定的node_modules文件夹下有无生成的文件)
  
4--在使用AngularJS的生成器之前,运行下面的脚本:使用它来生成AngularJS应用的基础结构  
    npm install -g generator-angular  
    npm install -g generator-karma  
    看看路径C:\Users\wangmingfeng\AppData\Roaming\npm\node_modules 下是否有生成的文件和文件夹;  
  
5--新建空的项目目录,比如myapp,然后在目录中运行下面的命令:  
    yo angular  
    grunt serve 

常见问题:

如果依次运行完npm install; bowere install; grunt serve;这3个命令
浏览器弹出来显示的url中含!(比如:http://localhost:9000/#!/),那么这是有问题的。
可以考虑把能正常运行的项目中的bower_components文件夹下的所有文件拷贝过来替换掉要运行的项目中。  
http://localhost:9000/#/menu/home?pa=15800550680&pb=XXX&pc=false 
app-server和app-client
用grunt build命令打包app-client,然后修改目录下scripts中的scripts*.js文件里面的内容
例如APIRoot:10.8.8.9:9000改为发布的服务器访问地址;
然后就可以把打包后的app-client扔到服务器比如/usr/local/nginx/html/下面。 
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容