Webpack Rails 项目教程
1. 项目的目录结构及介绍
webpack-rails/
├── app/
│ ├── assets/
│ ├── controllers/
│ ├── helpers/
│ ├── javascript/
│ ├── models/
│ ├── views/
├── bin/
├── config/
│ ├── environments/
│ ├── initializers/
│ ├── locales/
│ ├── webpack/
│ ├── application.rb
│ ├── boot.rb
│ ├── database.yml
│ ├── environment.rb
│ ├── routes.rb
│ ├── secrets.yml
├── db/
├── lib/
├── public/
├── spec/
├── test/
├── vendor/
├── .gitignore
├── .ruby-version
├── Gemfile
├── Gemfile.lock
├── package.json
├── Rakefile
├── README.md
目录结构介绍
app/
: 包含应用程序的主要代码,如控制器、模型、视图等。config/
: 包含应用程序的配置文件,如路由、数据库配置等。db/
: 包含数据库相关的文件,如迁移文件。lib/
: 包含自定义库和模块。public/
: 包含公开可访问的文件,如图片、CSS、JavaScript等。spec/
和test/
: 包含测试代码。vendor/
: 包含第三方库和插件。.gitignore
: 指定Git忽略的文件和目录。Gemfile
和Gemfile.lock
: 指定Ruby依赖包。package.json
: 指定Node.js依赖包。Rakefile
: 包含Rake任务。README.md
: 项目说明文档。
2. 项目的启动文件介绍
config/application.rb
这是Rails应用程序的主要配置文件,包含应用程序的基本设置和加载路径。
require_relative "boot"
require "rails/all"
# Require the gems listed in Gemfile, including any gems
# you've limited to :test, :development, or :production.
Bundler.require(*Rails.groups)
module WebpackRails
class Application < Rails::Application
# Initialize configuration defaults for originally generated Rails version.
config.load_defaults 6.1
# Configuration for the application, engines, and railties goes here.
#
# These settings can be overridden in specific environments using the files
# in config/environments, which are processed later.
#
# config.time_zone = "Central Time (US & Canada)"
# config.eager_load_paths << Rails.root.join("extras")
end
end
config/boot.rb
这是Rails应用程序的启动文件,负责加载Bundler和设置环境变量。
ENV['BUNDLE_GEMFILE'] ||= File.expand_path('../Gemfile', __dir__)
require 'bundler/setup' # Set up gems listed in the Gemfile.
3. 项目的配置文件介绍
config/webpack/development.js
这是Webpack在开发环境下的配置文件,包含Webpack的基本配置和插件设置。
const { webpackConfig, merge } = require('@rails/webpacker')
const customConfig = {
devtool: 'source-map'
}
module.exports = merge(webpackConfig, customConfig)
config/webpack/production.js
这是Webpack在生产环境下的配置文件,包含Webpack的优化配置和插件设置。
const { webpackConfig, merge } = require('@rails/webpacker')
const customConfig = {
devtool: 'none'
}
module.exports = merge(webpackConfig, customConfig)
config/webpack/test.js
这是Webpack在测试环境下的配置文件,包含Webpack的测试配置和插件设置。
const { webpackConfig, merge } = require('@rails/webpacker')
const customConfig = {
devtool: 'inline-source-map'
}
module.exports = merge(webpackConfig, customConfig)
以上是Webpack Rails项目的目录结构、启动文件和配置文件的介绍