一、 升級Rails到當前大版本的最新小版本
1，修改Gemfile中的版本號
vim中全局替換命令：":%s/6.0.3/6.1.6/g"
2，升級gem
bundle install
升級bundle本身
bundle update --bundler
帶版本號運行
bundle _2.3.7_ install
3, 運行rails升級命令"rails app:update"
rails app:update
如果報錯
rails aborted! Psych::BadAlias: Unknown alias: default /home/ruby/rubydev/projects/fas/config/environment.rb:5:in `<main>' /home/ruby/rubydev/projects/fas/bin/rails:9:in `<top (required)>' /home/ruby/rubydev/projects/fas/bin/spring:15:in `require'
因爲 psych這個gem的原因，解決放方案：
修改Gemfile，添加
gem 'psych', '~> 3.3'
bundle install
出現其他錯誤，根據提示解決，比如 可能需要 'yarn install --checkfiles'
二、升級到rails7.0.3
基本上重複上面的步驟
1，修改Gemfile中的版本號7.0.3
2，bundle
3, rails app:update
三、清理webpacker相關
1，刪除一些文件
rm package.json rm package-lock.json rm bin/webpack* rm bin/yarn rm -rf node_modules/ rm -rf public/packs/ rm yarn.lock rm yarn-error.log
下面這幾個時必須刪掉的，否則程序不能運行
rm -rf config/webpack rm config/webpacker.yml rm config/initializers/assets.rb
2，刪除或註釋掉無用gem，因爲自己編譯資源
#gem 'sass-rails', '>= 6'
#gem 'webpacker', '~> 4.0'
#gem 'turbolinks', '~> 5'
其中webpacker是必須刪除的，否則啓動失敗。
3，刪除config/中所有的配置文件中關於assets的配置，例如
config.assets.quiet = true
不清除這些設置應用也無法啓動
四、修改調整application.js 及 application.scss
1，修改app/javascript/packs/application.js
如下內容一律清除
require('jquery'); window.$ = $; window.jQuery = $; require("@rails/ujs").start() //require("turbolinks").start() require("@rails/activestorage").start() //require("channels") require("trix") require("@rails/actiontext") // Uncomment to copy all static images under ../images to the output folder and reference // them with the image_pack_tag helper in views (e.g <%= image_pack_tag 'rails.png' %>) // or the `imagePath` JavaScript helper below. // // const images = require.context('../images', true) // const imagePath = (name) => images(name, true) const images = require.context('../images', true); const imagePath = (name) => images(name, true); // libraries //require('bulma/css/bulma.min.css'); require('font-awesome/css/font-awesome.min.css') // app's style require('../stylesheets/application.scss');
2，清理app/javascript/stylesheets/application.scss，刪掉一切和自定義scss文件無關的引入。
3，處理原來打包的圖片資源
a) 原來放在app/javascript/images中的圖片資源，移動到public/images
b) 替換erb中的image_pack_tag 改爲 使用<img src>靜態引用。
<%= image_pack_tag 'logo-main.png', class: 'orbit-image'%>
修改爲===>
<img src="images/logo-main.png" class="orbit-image">
五、修改layouts文件中app資源引入方式
1，原來打包的第三方js、css框架（如jquery，fontAwesome）放置到public目錄下，改爲靜態引入：
<link rel="stylesheet" type="text/css" href="<%= root_path%>font-awesome/css/font-awesome.min.css"/> <script src="<%= root_path%>js/jquery-3.4.1/jquery.min.js"></script>
2，app相關js、css改爲靜態引入方式
首先，刪除如下兩行內容
<%= stylesheet_pack_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %> <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
然後安裝下列方式添加引用。
<link rel="stylesheet" type="text/css" href="<%= root_path%>packs/app.min.css"/> <script type="text/javascript" src="<%= root_path%>packs/app.min.js"></script>
六、自己實現js，scss編譯。
1，準備node環境。
安裝node
全局方式安裝esbuild
npm install -g esbuild
全局方式安裝sass
npm install -g sass
2，添加文件bin/web-dev-server.sh
#! /usr/bin/bash bash `/usr/bin/esbuild ./app/javascript/packs/application.js --outfile=./public/packs/app.min.js --watch --bundle --minify --sourcemap --color=true` & /usr/bin/node /usr/bin/sass --watch --style=compressed ./app/javascript/stylesheets/application.scss ./public/packs/app.min.css &
七、分發時不再需要預編譯。