vite_rails 1.0.6 → 1.0.11

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: e6696b0e5605b6b818d3512247732ca61379c1c54ffd2da4d4fba9aa45b0fb9e
-  data.tar.gz: 679a936095a88dfbc9a03b3bf0fe04003ebde7aad4d4cf1b65bd2dcf23c2fd22
+  metadata.gz: 9c6ae06bd2fe02d39882813646c291aa1984bf6f4bfbd337859c8527f83cdd66
+  data.tar.gz: 932af2eeadf8830685a6f1d30431849b1e46227147f34a11b286824d3ce80cf7
 SHA512:
-  metadata.gz: 4bf20acab3ed24be1785dcf2663d037ac4e026d1c73fb8a9b74b2487cda253a9e22b3e352930415296b1f746c9b777adfc664c2993664cfb2cb908e1b8850d1e
-  data.tar.gz: 44a029814b091587cd2d50589276cd1c757c18302e0155878c88c0e5cd0005353e24b32bc6c74205a0752291c5c24e51182b259e22f97c69ba16d713ebafbbe1
+  metadata.gz: 67f388f8c74bd39ee14f9d8033941a7616400f9e725a1c2cec7f459f9faa06457dcb113648d9bdb672b5497093f3905bddc13928b834c91f43cef08a58de0e65
+  data.tar.gz: fba446503a41accc9bd4a769042858789615b2095171d6c138c0f2aaf0471ce741da98d9aa058fabc1ee92e2f667b8c19bcab48980ea4288d4b4400b53d94f15

data/CHANGELOG.md

@@ -1,3 +1,27 @@
+## Vite Rails 1.0.11  (2020-01-24)
+
+- Fix bug in `assetHost` that caused `base` to be configured incorrectly.
+- Allow installing `vite` and `vite-plugin-ruby` as devDependencies, and install them when precompiling assets.
+- Move `base` to the configuration root after Vite's update in beta.38
+
+## Vite Rails 1.0.10  (2020-01-23)
+
+- Use `path_to_asset` in `vite_asset_path` so that it's prefixed automatically
+  when using a CDN (`config.action_controller.asset_host`).
+
+## Vite Rails 1.0.9  (2020-01-22)
+
+- Ensure `configPath` and `publicDir` are scoped from `root`, both in Ruby and JS.
+
+## Vite Rails 1.0.8  (2020-01-21)
+
+- Change the default of `sourceCodeDir` to `app/frontend`, add instructions for folks migrating
+from a `app/javascript` structure.
+
+## Vite Rails 1.0.7  (2020-01-20)
+
+- Add `vite_client_tag` to ensure the Vite client can be loaded in apps that don't use any imports.
+
 ## Vite Rails 1.0.6  (2020-01-20)
 
 - Ensure running `bin/rake assets:precompile` automatically invokes `vite:build`.

data/CONTRIBUTING.md

@@ -6,7 +6,6 @@
 
 ```
 bundle install
-yarn
 ```
 
 ## Making sure your changes pass all tests

data/README.md

@@ -1,15 +1,26 @@
 <h1 align="center">
-  Vite ⚡️ Rails
+  <a href="https://vite-rails.netlify.app/">
+    <img src="https://raw.githubusercontent.com/ElMassimo/vite_rails/main/docs/public/logo.svg" width="120px"/>
+  </a>
+
+  <br>
+
+  <a href="https://vite-rails.netlify.app/">
+    Vite Rails
+  </a>
+
+  <br>
+  
   <p align="center">
-<!--     <a href="https://github.com/ElMassimo/vite_rails/actions">
+    <a href="https://github.com/ElMassimo/vite_rails/actions">
       <img alt="Build Status" src="https://github.com/ElMassimo/vite_rails/workflows/build/badge.svg"/>
-    </a> -->
-    <!-- <a href="https://codeclimate.com/github/ElMassimo/vite_rails">
+    </a>
+    <a href="https://codeclimate.com/github/ElMassimo/vite_rails">
       <img alt="Maintainability" src="https://codeclimate.com/github/ElMassimo/vite_rails/badges/gpa.svg"/>
     </a>
     <a href="https://codeclimate.com/github/ElMassimo/vite_rails">
       <img alt="Test Coverage" src="https://codeclimate.com/github/ElMassimo/vite_rails/badges/coverage.svg"/>
-    </a> -->
+    </a>
     <a href="https://rubygems.org/gems/vite_rails">
       <img alt="Gem Version" src="https://img.shields.io/gem/v/vite_rails.svg?colorB=e9573f"/>
     </a>
@@ -19,26 +30,35 @@
   </p>
 </h1>
 
+[website]: https://vite-rails.netlify.app/
+[configuration reference]: https://vite-rails.netlify.app/config/
+[features]: https://vite-rails.netlify.app/guide/introduction.html
+[guides]: https://vite-rails.netlify.app/guide/
+[config]: https://vite-rails.netlify.app/config/
 [vite_rails]: https://github.com/ElMassimo/vite_rails
 [webpacker]: https://github.com/rails/webpacker
 [vite]: http://vitejs.dev/
 [config file]: https://github.com/ElMassimo/vite_rails/blob/main/package/default.vite.json
+[example app]: https://github.com/ElMassimo/vite_rails/tree/main/examples/blog
+[heroku]: https://vite-rails-demo.herokuapp.com/
 
-[__Vite Rails__][vite_rails] allows you to use [Vite] to power the frontend.
+[__Vite Rails__][vite_rails] allows you to use [Vite] to power the frontend of your Rails app.
 
 [Vite] is to frontend tooling as Ruby to programming, pure joy! 😍
 
+Check an [example app] running on [Heroku].
+
 ## Features ⚡️
 
-- 🤖 Automatic Entrypoint Detection
-- ⚡️ Hot Reload
-- ⚙️ Rake Tasks
-- 🤝 Integrated with <kbd>assets:precompile</kbd> and friends
-- And more! (detects changes, and builds automatically if Vite is not running)
+- 🤖 Automatic entrypoint detection
+- ⚡️ Blazing fast hot reload
+- 🚀 Zero-config deployments
+- 🤝 Integrated with <kbd>assets:precompile</kbd>
+- [And more!][features]
 
 ## Documentation 📖
 
-A documentation website is coming soon!
+Visit the [documentation website][website] to check out the [guides] and searchable [configuration reference].
 
 ## Installation 💿
 
@@ -57,74 +77,27 @@ bin/rake vite:install
 
 This will generate configuration files and a sample setup.
 
-## Usage 🚀
-
-Drawing inspiration from [webpacker], any files in `app/javascript/entrypoints`
-will be considered entries to your application (SPAs or pages).
+Additional installation instructions are available in the [documentation website][website].
 
-These files will be detected, and passed on to Vite, all configuration is done
-for you.
+## Getting Started 💻
 
-### Imports ⤵️
+Restart your Rails server, and then run <kbd>bin/vite</kbd> to start the Vite development server.
 
-For convenience, a `~/` import alias is configured to `app/javascript`, allowing
-you to use absolute paths:
+Add the following your `views/layouts/application.html.erb`:
 
-```js
-import { createApp } from 'vue'
-import App from '~/App.vue'
-import '~/channels'
-
-createApp(App).mount('#app')
-```
-
-### Tags 🏷
-
-`vite_typescript_tag`, `vite_javascript_tag`, and `vite_stylesheet_tag` can be
-used to output `<script>` and `<link>` tags in your Rails layouts or templates.
-
-```html
-<head>
-  <title>Joie</title>
-  <%= csrf_meta_tags %>
-  <%= csp_meta_tag %>
-
-  <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
-  <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
-
-  <%= vite_stylesheet_tag 'strange' %>
-  <%= vite_typescript_tag 'application' %>
-</head>
+```erb
+<%= vite_client_tag %>
+<%= vite_javascript_tag 'application' %>
 ```
 
-For other types of assets, you can use `vite_asset_path` and pass that to the appropriate tag helper.
-
-## Configuration ⚙️
-
-This is what your `config/vite.json` might look like:
-
-```json
-{
-  "all": {
-    "watchAdditionalPaths": []
-  },
-  "development": {
-    "autoBuild": true,
-    "publicOutputDir": "vite-dev",
-    "port": 3036
-  },
-  "test": {
-    "autoBuild": true,
-    "publicOutputDir": "vite-test"
-  }
-}
-```
+Visit any page and you should see a printed console output: `Vite ⚡️ Rails`.
 
-Check [this file][config file] to see all config options, documentation is coming soon.
+For more [guides] and a full [configuration reference], check the [documentation website][website].
 
-## Inspiration 💡
+## Special Thanks 🙏
 
 - [webpacker]
+- [vite]
 
 ## License
 

data/lib/install/config/vite.config.ts

@@ -6,6 +6,6 @@ export default defineConfig({
     RubyPlugin(),
   ],
   optimizeDeps: {
-    exclude: [/webpack/, /vite-plugin-ruby/],
+    exclude: [/webpack/], // In case webpacker is installed (these deps won't be imported)
   },
 })

data/lib/install/javascript/entrypoints/application.js

@@ -1,3 +1,10 @@
+// To see this message, add the following to the `<head>` section in your
+// views/layouts/application.html.erb
+//
+//    <%= vite_client_tag %>
+//    <%= vite_javascript_tag 'application' %>
+console.log('Vite ⚡️ Rails')
+
 // Example: Load Rails libraries in Vite.
 //
 // import '@rails/ujs'
@@ -11,8 +18,5 @@
 // Turbolinks.start()
 // ActiveStorage.start()
 
-// Example: Import a stylesheet in app/javascript/index.css
+// Example: Import a stylesheet in app/frontend/index.css
 // import '~/index.css'
-
-console.log('Vite ⚡️ Rails')
-

data/lib/install/template.rb

@@ -6,7 +6,7 @@ copy_file "#{ __dir__ }/config/vite.json", ViteRails.config.config_path
 copy_file "#{ __dir__ }/config/vite.config.ts", Rails.root.join('vite.config.ts')
 
 say 'Creating entrypoints directory'
-directory "#{ __dir__ }/javascript/entrypoints", ViteRails.config.source_code_dir.join(ViteRails.config.entrypoints_dir)
+directory "#{ __dir__ }/javascript/entrypoints", ViteRails.config.resolved_entrypoints_dir
 
 apply "#{ __dir__ }/binstubs.rb"
 
@@ -33,8 +33,8 @@ Dir.chdir(Rails.root) do
   vite_version = package_json.match(/"vite": "(.*)"/)[1]
   plugin_version = package_json.match(/"vite-plugin-ruby": "(.*)"/)[1]
 
-  say 'Installing vite as direct dependencies'
-  run "yarn add vite@#{ vite_version } vite-plugin-ruby@#{ plugin_version }"
+  say 'Installing vite as build dependencies'
+  run "yarn add -D vite@#{ vite_version } vite-plugin-ruby@#{ plugin_version }"
 end
 
 say 'Vite ⚡️ Rails successfully installed! 🎉', :green

data/lib/tasks/vite/build.rake

@@ -3,21 +3,27 @@
 $stdout.sync = true
 
 def enhance_assets_precompile
+  # Before installing
+  ['yarn:install', 'webpacker:yarn_install'].each do |name|
+    Rake::Task[name].enhance([:'vite:set_node_env']) if Rake::Task.task_defined?(name)
+  end
+
+  # After precompiling
   Rake::Task['assets:precompile'].enhance do |task|
     prefix = task.name.split(/#|assets:precompile/).first
-
     Rake::Task["#{ prefix }vite:build"].invoke
   end
 end
 
 namespace :vite do
+  desc 'Fixes Rails management of node dev dependencies (build dependencies)'
+  task :set_node_env do
+    ENV['NODE_ENV'] = 'development'
+  end
+
   desc 'Compile JavaScript packs using vite for production with digests'
   task build: [:'vite:verify_install', :environment] do
-    ViteRails.with_node_env(ENV.fetch('NODE_ENV', 'production')) do
-      ViteRails.ensure_log_goes_to_stdout do
-        ViteRails.build || exit!
-      end
-    end
+    ViteRails.build_from_rake
   end
 end
 

data/lib/tasks/vite/clean.rake

@@ -5,9 +5,7 @@ $stdout.sync = true
 namespace :vite do
   desc 'Remove old compiled vites'
   task :clean, [:keep, :age] => [:'vite:verify_install', :environment] do |_, args|
-    ViteRails.ensure_log_goes_to_stdout do
-      ViteRails.clean(keep_up_to: Integer(args.keep || 2), age_in_seconds: Integer(args.age || 3600))
-    end
+    ViteRails.clean_from_rake(args)
   end
 end
 

data/lib/tasks/vite/install_dependencies.rake

@@ -1,19 +1,13 @@
 # frozen_string_literal: true
 
 namespace :vite do
-  desc 'Support for older Rails versions. Install all JavaScript dependencies as specified via Yarn'
+  desc 'Install all JavaScript dependencies as specified via Yarn'
   task :install_dependencies do
     valid_node_envs = %w[test development production]
     node_env = ENV.fetch('NODE_ENV') { valid_node_envs.include?(Rails.env) ? Rails.env : 'production' }
     Dir.chdir(Rails.root) do
-      install_command = if Rails.root.join('yarn.lock').exist?
-        v1 = `yarn --version`.start_with?('1')
-        "yarn install #{ v1 ? '--no-progress --frozen-lockfile' : '--immutable' }"
-      elsif Rails.root.join('pnpm-lock.yaml').exist?
-        'pnpm install'
-      else
-        'npm ci'
-      end
+      v1 = `yarn --version`.start_with?('1')
+      install_command = "yarn install #{ v1 ? '--no-progress --frozen-lockfile' : '--immutable' } --production=false"
       system({ 'NODE_ENV' => node_env }, install_command)
     end
   end

data/lib/tasks/vite/verify_install.rake

@@ -11,10 +11,10 @@ namespace :vite do
       WARN
       exit!
     end
-    unless ViteRails.config.config_path.exist?
-      path = ViteRails.config.config_path.relative_path_from(Pathname.new(pwd)).to_s
+    config_path = Rails.root.join(ViteRails.config.config_path)
+    unless config_path.exist?
       warn <<~WARN
-        Configuration #{ path } file for vite-plugin-ruby not found.
+        Configuration #{ config_path } file for vite-plugin-ruby not found.
         Make sure vite:install has run successfully before running dependent tasks.
       WARN
       exit!

data/lib/vite_rails.rb

@@ -1,7 +1,7 @@
 # frozen_string_literal: true
 
-require 'active_support'
-require 'active_support/core_ext/class/attribute_accessors'
+require 'rails'
+require 'active_support/all'
 
 require 'zeitwerk'
 loader = Zeitwerk::Loader.for_gem
@@ -13,18 +13,10 @@ class ViteRails
   # Internal: Prefix used for environment variables that modify the configuration.
   ENV_PREFIX = 'VITE_RUBY'
 
-  # Public: Additional environment variables to pass to Vite.
-  #
-  # Example:
-  #   ViteRails.env['VITE_RUBY_CONFIG_PATH'] = 'config/alternate_vite.json'
-  cattr_accessor(:env) { ENV.select { |key, _| key.start_with?(ENV_PREFIX) } }
-
-  cattr_accessor(:logger) { ActiveSupport::TaggedLogging.new(ActiveSupport::Logger.new(STDOUT)) }
-
   class << self
-    delegate :config, :builder, :manifest, :commands, :dev_server, :dev_server_running?, to: :instance
+    delegate :config, :builder, :manifest, :commands, :dev_server, :dev_server_running?, :run_proxy?, to: :instance
     delegate :mode, to: :config
-    delegate :bootstrap, :clean, :clobber, :build, to: :commands
+    delegate :bootstrap, :clean, :clean_from_rake, :clobber, :build, :build_from_rake, to: :commands
 
     attr_writer :instance
 
@@ -37,34 +29,31 @@ class ViteRails
       ViteRails::Runner.new(args).run
     end
 
-    # Public: The proxy for assets should only run in development mode.
-    def run_proxy?
-      config.mode == 'development'
-    rescue StandardError => error
-      logger.error("Failed to check mode for Vite: #{ error.message }")
-      false
+    # Internal: Allows to obtain any env variables for configuration options.
+    def load_env_variables
+      ENV.select { |key, _| key.start_with?(ENV_PREFIX) }
     end
+  end
 
-    def with_node_env(env)
-      original = ENV['NODE_ENV']
-      ENV['NODE_ENV'] = env
-      yield
-    ensure
-      ENV['NODE_ENV'] = original
-    end
+  # Public: Additional environment variables to pass to Vite.
+  #
+  # Example:
+  #   ViteRails.env['VITE_RUBY_CONFIG_PATH'] = 'config/alternate_vite.json'
+  cattr_accessor(:env) { load_env_variables }
 
-    def ensure_log_goes_to_stdout
-      old_logger = ViteRails.logger
-      ViteRails.logger = ActiveSupport::Logger.new(STDOUT)
-      yield
-    ensure
-      ViteRails.logger = old_logger
-    end
-  end
+  cattr_accessor(:logger) { ActiveSupport::TaggedLogging.new(ActiveSupport::Logger.new(STDOUT)) }
 
   # Public: Returns true if the Vite development server is running.
   def dev_server_running?
-    ViteRails.run_proxy? && dev_server.running?
+    run_proxy? && dev_server.running?
+  end
+
+  # Public: The proxy for assets should only run in development mode.
+  def run_proxy?
+    config.mode == 'development'
+  rescue StandardError => error
+    ViteRails.logger.error("Failed to check mode for Vite: #{ error.message }")
+    false
   end
 
   # Public: Current instance configuration for Vite.

data/lib/vite_rails/builder.rb

@@ -67,9 +67,18 @@ private
   def build_with_vite
     logger.info 'Building with Vite ⚡️'
 
-    stdout, stderr, status = Open3.capture3(vite_env,
-      "#{ which_ruby } ./bin/vite build --mode #{ config.mode }", chdir: File.expand_path(config.root))
+    command = "#{ which_ruby } ./bin/vite build --mode #{ config.mode }"
+    stdout, stderr, status = Open3.capture3(ViteRails.config.to_env, command, chdir: File.expand_path(config.root))
 
+    log_build_result(stdout, stderr, status)
+
+    status.success?
+  end
+
+  # Internal: Outputs the build results.
+  #
+  # NOTE: By default it also outputs the manifest entries.
+  def log_build_result(stdout, stderr, status)
     if status.success?
       logger.info "Build with Vite complete: #{ config.build_output_dir }"
       logger.error(stderr.to_s) unless stderr.empty?
@@ -78,8 +87,6 @@ private
       non_empty_streams = [stdout, stderr].delete_if(&:empty?)
       logger.error "Build with Vite failed:\n#{ non_empty_streams.join("\n\n") }"
     end
-
-    status.success?
   end
 
   # Internal: Used to prefix the bin/vite executable file.
@@ -101,13 +108,4 @@ private
       config.config_path,
     ].freeze
   end
-
-  # Internal: Sets additional environment variables for vite-plugin-ruby.
-  def vite_env
-    ViteRails.env.merge(
-      "#{ ViteRails::ENV_PREFIX }_CONFIG_PATH" => config.config_path,
-      "#{ ViteRails::ENV_PREFIX }_MODE" => config.mode,
-      "#{ ViteRails::ENV_PREFIX }_ROOT" => config.root,
-    ).transform_values(&:to_s)
-  end
 end