使用Rails进行开发时未更新的Javascript文件

Question

我在一个Rails项目中工作，使用Webpack来捆绑资产。每次我在JS或CSS中进行更改时，我都会运行docker-compose exec web bundle exec rake assets:precompile;来编译所有资产。

在此之后，我必须重新启动docker容器，并运行docker-compose exec web bundle exec npm run dev;

只有在此之后，我才能看到更改，这可能需要10分钟。我遗漏了什么？如何加快我的开发过程？

我的docker-compose.yml：

 version: '2'
services:
  chromedriver:
    image: selenium/standalone-chrome-debug
    volumes:
      # use hosts shared memory to prevent crashes
      # https://github.com/SeleniumHQ/docker-selenium
      - /dev/shm:/dev/shm



  postgres:
    image: postgis/postgis:12-3.0
    volumes:
      - ./bin/docker/postgres/init-test-db.sh:/docker-entrypoint-initdb.d/init-test-db.sh
      - .:/project
    logging:
      driver: "json-file"
      options:
        max-size: "10k"
        max-file: "1"

redis:
        image: redis:5.0.5
        logging:
          driver: "json-file"
          options:
            max-size: "10k"
            max-file: "1"
  worker:
    build: .
    volumes:
      - .:/usr/src/app
      - bundle-cache:/usr/local/bundle
    command: bundle exec sidekiq
    logging:
      driver: "json-file"
      options:
        max-size: "100k"
        max-file: "1"

  web:
    tty: true
    stdin_open: true
    build: .
    volumes:
      - .:/usr/src/app
      - bundle-cache:/usr/local/bundle
    logging:
      driver: "json-file"
      options:
        max-size: "10k"
        max-file: "1"

volumes:
  bundle-cache:

Answer 1

当您正在使用docker-compose时，使用volumes来更改计算机中的文件并使用docker-compose up启动您的compose是非常有用的。

在开发阶段重建资产看起来很奇怪。有没有可能绕过这一步？我不知道Rails，但在python Django中，“收集静态数据”仅用于生产是可能的。

Answer 2

在核心，有一个与Docker无关的问题:如果你的应用程序配置正确，你不应该需要手动编译你的资产- ever！即使你不得不这么做，10分钟听起来也太多了。

因此，您应该做的第一件事是确保以下内容：

• 您的应用程序是否在development环境中运行(= Rails.env是否返回development)？如果没有，尝试设置RAILS_ENV=development -例如，可以在docker-compose.yml的environment设置中完成(或者在.env.development文件中，如果您使用dotenv-rails gem)。
• 是在development环境中启用的即席资产编译？默认情况下，应该是这种情况，但您可能无意/有意地更改了它。检查config/environments/development.rb是否不包含config.assets.compile = false (或者，通常，检查Rails.application.config.assets.compile，甚至可能包含整个Rails.application.config.assets Rails.application.config.assets.compile，但如上所述，10分钟对于资产编译来说似乎是非常长的时间。我只记得有一次资产编译时间这么长--那是在一个Rails3应用程序上，在一个免费的Heroku实例上，有几十个来自rails-assets.org的gem(相当于一般的超级慢)。因此，请考虑检查您是否加载了太多在资产编译步骤中并不真正需要的东西和/或库。在我的经验中，一个非常常见的违规者是moment.js库，它非常庞大，通常只为非常有限的几个功能加载，这些功能通常可以由更简单的库替换，如date-fns或js-joda。

我很乐意进一步调查并提供更多的见解，但我认为你必须分享更多的东西(例如，你的Gemfile和环境配置)。

至于Docker，当使用资产管道(或更新的Rails版本的webpack集成)时，我建议将编译后的资产编成卷，这样它们就可以被有效地缓存。这可以像这样完成：

# in the `web` service:
volumes:
  # for asset pipeline
  - assets:/usr/src/app/public/assets
  # for webpacker
  - packs:/usr/src/app/public/packs
  - packs-test:/usr/src/app/public/packs-test

Answer 3

既然有了webpack，为什么不用webpack来编译呢？

bundle exec rails webpacker:compile

您还可以为您的webpack添加speed-measure-webpack-plugin，以查看花在编译上的时间的详细信息

在你的config/webpack/development.js中

process.env.NODE_ENV = process.env.NODE_ENV || 'development'

const environment = require('./environment')

const SpeedMeasurePlugin = require('speed-measure-webpack-plugin')
const smp = new SpeedMeasurePlugin()

module.exports = smp.wrap(environment.toWebpackConfig())

最后，在你的application.html.erb中，一定要使用<%= javascript_pack_tag 'application' %>来链接webpack编译过的js

此外，您还应该研究一下带有rails的webpack开发服务器，这样您就不需要在每次更改时都重新启动