部署 ruby-on-rails + angularJS 项目答案

【问题标题】：Deploying ruby-on-rails + angularJS project部署 ruby-on-rails + angularJS 项目
【发布时间】：2015-08-18 16:52:13
【问题描述】：

尝试部署 rails + angular 项目。

已解决：结果（来自浏览器日志）：

1) 其中一个js文件有小错误。

2) 由于依赖关系混乱，未加载主模块，但错误消息显示在引导文件之一 (?!)。重新安装 twitter-bootstrap gem。

但是我仍然不明白为什么项目在开发中有效并且在生产中没有价值。

运行rails s -e production，rails 正常响应，渲染布局， assets/javascripts 文件夹已加载（将事件绑定到窗口 onload - 工作）。但是所有的凉亭插件，包括 angular、jquery 等都不起作用。 heroku 上本地的相同问题。资产被编译到 tmp/... 文件夹。部署成功结束，但是angular部分不起作用（日志中没有错误），以及jquery和所有插件。

在配置/应用程序中：

config.serve_static_files = true
config.less.paths << Rails.root.join('app', 'assets', 'bower_components')
config.assets.paths << Rails.root.join('app', 'assets', 'bower_components')
config.assets.initialize_on_precompile = true
config.assets.precompile = ['*.js', '*.css', '*.css.erb', '*.eot', '*.svg', '*.ttf', '*.woff', '*.woff2']

在配置/环境/生产中：

config.assets.js_compressor = :uglifier
config.assets.js_compressor = Uglifier.new(:mangle => false)
config.assets.digest = true
config.assets.compile = true

试过bundle exec rake:assets:precompile RAILS_ENV=production：没有帮助。

我认为加载插件（bower 文件夹、引导程序、jquery 等）作为主文件 application.js 已成功查询和呈现（日志）有问题，但插件似乎没有工作找到了。

application.js：

//= require jquery
//= require jquery_ujs
//= require twitter/bootstrap
//= require angular
//= require angular-rails-templates
//= require angular-devise
//= require angular-ui-router
//= require angular-route
//= require angular-bootstrap
//= require angular-touch
//= require ng-tags-input
//= require angular-loading-bar
//= require angular-xeditable
//= require ng-file-upload-shim
//= require ng-file-upload
//= require Buttons
//= require x-editable
//= require angular-ui-notification
//= require_tree ../templates
//= require_tree .

angular.module('boo', ['boo-factories', 'boo-controllers', 'ui-notification', 'ngTagsInput', 'angular-loading-bar', 'ui.router', 'ui.bootstrap', 'templates', 'Devise', 'ngFileUpload', 'xeditable', 'bootstrapLightbox']);

等等……

【问题讨论】：

如果您在浏览器中打开该站点并右键单击->“检查元素”以调出控制台，您能看到它正在下载哪些资产吗？在 Chrome 中，它位于“资源”->“框架”下。您将看到“脚本”、“样式”等条目。
还有在使用inspector时有什么错误提示吗？
未捕获错误：[$injector:modulerr] 无法实例化模块 boo，原因是：错误：[$injector:nomod] 模块“boo”不可用！您要么拼错了模块名称，要么忘记加载它。如果注册模块，请确保将依赖项指定为第二个参数。
Angular 模块不知何故不可用。真奇怪，那为什么在开发模式下就可以了……
检查我修改后的答案@ElizavetaOlehnovich

标签： ruby-on-rails ruby angularjs ruby-on-rails-4 asset-pipeline

【解决方案1】：

我认为正在发生的事情是，由于您正在编译资产以及制作 Angular 应用程序的方式，一些 Angular 代码被分散并且资产管道或浏览器无法理解。

一个快速但肮脏的解决方案（因为加载页面需要更长的时间）是：

编辑 config/environments/production.rb，注释此行：

config.assets.js_compressor = :uglifier
使用以下命令清理生产环境中的资产管道：

RAILS_ENV=生产 rake assets:clean
最后，再次启动服务器：

rails s -e 生产

【讨论】：

我当然需要依赖。正如我所说：在开发模式下一切正常。
您能告诉我们您的 application.js 中有什么吗？ @ElizavetaOlehnovich
从问题中可以看出，压缩已关闭。如果我用 :uglifier 注释掉一行，文件无论如何都会被压缩。

【解决方案2】：

你有什么理由决定坚持在 application.js 中加载你的模块吗？我会将其外部化到另一个名为 app.js 的文件中，并确保在您的工厂、控制器、服务等之前将其加载到树中。

我会遵循有关确保您的资产在生产中不会被缩小的建议。这会做一些奇怪的事情。

【讨论】：