webpacker-jets 3.2.100

data/lib/install/examples/vue/hello_vue.js

@@ -0,0 +1,70 @@
+/* eslint no-console: 0 */
+// Run this example by adding <%= javascript_pack_tag 'hello_vue' %> (and
+// <%= stylesheet_pack_tag 'hello_vue' %> if you have styles in your component)
+// to the head of your layout file,
+// like app/views/layouts/application.html.erb.
+// All it does is render <div>Hello Vue</div> at the bottom of the page.
+
+import Vue from 'vue'
+import App from '../app.vue'
+
+document.addEventListener('DOMContentLoaded', () => {
+  document.body.appendChild(document.createElement('hello'))
+  const app = new Vue({
+    render: h => h(App)
+  }).$mount('hello')
+
+  console.log(app)
+})
+
+
+// The above code uses Vue without the compiler, which means you cannot
+// use Vue to target elements in your existing html templates. You would
+// need to always use single file components.
+// To be able to target elements in your existing html/erb templates,
+// comment out the above code and uncomment the below
+// Add <%= javascript_pack_tag 'hello_vue' %> to your layout
+// Then add this markup to your html template:
+//
+// <div id='hello'>
+//   {{message}}
+//   <app></app>
+// </div>
+
+
+// import Vue from 'vue/dist/vue.esm'
+// import App from '../app.vue'
+//
+// document.addEventListener('DOMContentLoaded', () => {
+//   const app = new Vue({
+//     el: '#hello',
+//     data: {
+//       message: "Can you say hello?"
+//     },
+//     components: { App }
+//   })
+// })
+//
+//
+//
+// If the using turbolinks, install 'vue-turbolinks':
+//
+// yarn add 'vue-turbolinks'
+//
+// Then uncomment the code block below:
+//
+// import TurbolinksAdapter from 'vue-turbolinks';
+// import Vue from 'vue/dist/vue.esm'
+// import App from '../app.vue'
+//
+// Vue.use(TurbolinksAdapter)
+//
+// document.addEventListener('turbolinks:load', () => {
+//   const app = new Vue({
+//     el: '#hello',
+//     data: {
+//       message: "Can you say hello?"
+//     },
+//     components: { App }
+//   })
+// })

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

@@ -0,0 +1,10 @@
+/* eslint no-console:0 */
+// This file is automatically compiled by Webpack, along with any other files
+// present in this directory. You're encouraged to place your actual application logic in
+// a relevant structure within app/javascript and only use these pack files to reference
+// that code so it'll be compiled.
+//
+// To reference this file, add <%= javascript_pack_tag 'application' %> to the appropriate
+// layout file, like app/views/layouts/application.html.erb
+
+console.log('Hello World from Webpacker')

data/lib/install/loaders/coffee.js

@@ -0,0 +1,6 @@
+module.exports = {
+  test: /\.coffee(\.erb)?$/,
+  use: [{
+    loader: 'coffee-loader'
+  }]
+}

data/lib/install/loaders/elm.js

@@ -0,0 +1,23 @@
+const { resolve } = require('path')
+
+const isProduction = process.env.NODE_ENV === 'production'
+const elmSource = resolve(process.cwd())
+const elmMake = `${elmSource}/node_modules/.bin/elm-make`
+
+const elmDefaultOptions = { cwd: elmSource, pathToMake: elmMake }
+const developmentOptions = Object.assign({}, elmDefaultOptions, {
+  verbose: true,
+  warn: true,
+  debug: true
+})
+
+const elmWebpackLoader = {
+  loader: 'elm-webpack-loader',
+  options: isProduction ? elmDefaultOptions : developmentOptions
+}
+
+module.exports = {
+  test: /\.elm(\.erb)?$/,
+  exclude: [/elm-stuff/, /node_modules/],
+  use: isProduction ? [elmWebpackLoader] : [{ loader: 'elm-hot-loader' }, elmWebpackLoader]
+}

data/lib/install/loaders/erb.js

@@ -0,0 +1,11 @@
+module.exports = {
+  test: /\.erb$/,
+  enforce: 'pre',
+  exclude: /node_modules/,
+  use: [{
+    loader: 'rails-erb-loader',
+    options: {
+      runner: 'bin/rails runner'
+    }
+  }]
+}

data/lib/install/loaders/typescript.js

@@ -0,0 +1,6 @@
+module.exports = {
+  test: /\.(ts|tsx)?(\.erb)?$/,
+  use: [{
+    loader: 'ts-loader'
+  }]
+}

data/lib/install/loaders/vue.js

@@ -0,0 +1,13 @@
+const { dev_server: devServer } = require('@rails/webpacker').config
+
+const isProduction = process.env.NODE_ENV === 'production'
+const inDevServer = process.argv.find(v => v.includes('webpack-dev-server'))
+const extractCSS = !(inDevServer && (devServer && devServer.hmr)) || isProduction
+
+module.exports = {
+  test: /\.vue(\.erb)?$/,
+  use: [{
+    loader: 'vue-loader',
+    options: { extractCSS }
+  }]
+}

data/lib/install/react.rb

@@ -0,0 +1,28 @@
+require "webpacker/configuration"
+
+babelrc = Jets.root.join(".babelrc")
+
+if File.exist?(babelrc)
+  react_babelrc = JSON.parse(File.read(babelrc))
+  react_babelrc["presets"] ||= []
+
+  unless react_babelrc["presets"].include?("react")
+    react_babelrc["presets"].push("react")
+    say "Copying react preset to your .babelrc file"
+
+    File.open(babelrc, "w") do |f|
+      f.puts JSON.pretty_generate(react_babelrc)
+    end
+  end
+else
+  say "Copying .babelrc to app root directory"
+  copy_file "#{__dir__}/examples/react/.babelrc", ".babelrc"
+end
+
+say "Copying react example entry file to #{Webpacker.config.source_entry_path}"
+copy_file "#{__dir__}/examples/react/hello_react.jsx", "#{Webpacker.config.source_entry_path}/hello_react.jsx"
+
+say "Installing all react dependencies"
+run "yarn add react react-dom babel-preset-react prop-types"
+
+say "Webpacker now supports react.js 🎉", :green

data/lib/install/template.rb

@@ -0,0 +1,37 @@
+# Install Webpacker
+copy_file "#{__dir__}/config/webpacker.yml", "config/webpacker.yml"
+
+puts "Copying webpack core config"
+directory "#{__dir__}/config/webpack", "config/webpack"
+
+say "Copying .postcssrc.yml to app root directory"
+copy_file "#{__dir__}/config/.postcssrc.yml", ".postcssrc.yml"
+
+say "Copying .babelrc to app root directory"
+copy_file "#{__dir__}/config/.babelrc", ".babelrc"
+
+# Jets handles creating javascript directory after webpacker:install runs
+unless defined?(Jets)
+  say "Creating JavaScript app source directory"
+  directory "#{__dir__}/javascript", Webpacker.config.source_path, force: options[:force]
+  # How to use the FORCE: rake webpacker:install FORCE=1
+end
+
+say "Installing binstubs"
+run "bundle binstubs webpacker"
+
+if File.exists?(".gitignore")
+  append_to_file ".gitignore", <<-EOS
+/public/packs
+/public/packs-test
+/node_modules
+EOS
+end
+
+say "Installing all JavaScript dependencies"
+run "yarn add @rails/webpacker coffeescript@1.12.7"
+
+say "Installing dev server for live reloading"
+run "yarn add --dev webpack-dev-server"
+
+say "Webpacker successfully installed 🎉 🍰", :green

data/lib/install/vue.rb

@@ -0,0 +1,26 @@
+require "webpacker/configuration"
+
+say "Copying vue loader to config/webpack/loaders"
+copy_file "#{__dir__}/loaders/vue.js", Jets.root.join("config/webpack/loaders/vue.js").to_s
+
+say "Adding vue loader to config/webpack/environment.js"
+insert_into_file Jets.root.join("config/webpack/environment.js").to_s,
+  "const vue =  require('./loaders/vue')\n",
+  after: "require('@rails/webpacker')\n"
+
+insert_into_file Jets.root.join("config/webpack/environment.js").to_s,
+  "environment.loaders.append('vue', vue)\n",
+  before: "module.exports"
+
+say "Copying the example entry file to #{Webpacker.config.source_entry_path}"
+copy_file "#{__dir__}/examples/vue/hello_vue.js",
+  "#{Webpacker.config.source_entry_path}/hello_vue.js"
+
+say "Copying Vue app file to #{Webpacker.config.source_entry_path}"
+copy_file "#{__dir__}/examples/vue/app.vue",
+  "#{Webpacker.config.source_path}/app.vue"
+
+say "Installing all Vue dependencies"
+run "yarn add vue vue-loader vue-template-compiler"
+
+say "Webpacker now supports Vue.js 🎉", :green

data/lib/tasks/installers.rake

@@ -0,0 +1,24 @@
+installers = {
+  "Angular": :angular,
+  "Elm": :elm,
+  "React": :react,
+  "Vue": :vue,
+  "Erb": :erb,
+  "Coffee": :coffee
+}.freeze
+
+namespace :webpacker do
+  namespace :install do
+    installers.each do |name, task_name|
+      desc "Install everything needed for #{name}"
+      task task_name => ["webpacker:verify_install"] do
+        template = File.expand_path("../install/#{task_name}.rb", __dir__)
+        if Rails::VERSION::MAJOR >= 5
+          exec "#{RbConfig.ruby} ./bin/rails app:template LOCATION=#{template}"
+        else
+          exec "#{RbConfig.ruby} ./bin/rake rails:template LOCATION=#{template}"
+        end
+      end
+    end
+  end
+end

data/lib/tasks/webpacker.rake

@@ -0,0 +1,22 @@
+tasks = {
+  "webpacker:install"                 => "Installs and setup webpack with Yarn",
+  "webpacker:compile"                 => "Compiles webpack bundles based on environment",
+  "webpacker:clobber"                 => "Removes the webpack compiled output directory",
+  "webpacker:check_node"              => "Verifies if Node.js is installed",
+  "webpacker:check_yarn"              => "Verifies if Yarn is installed",
+  "webpacker:check_binstubs"          => "Verifies that webpack & webpack-dev-server are present",
+  "webpacker:verify_install"          => "Verifies if Webpacker is installed",
+  "webpacker:yarn_install"            => "Install all JavaScript dependencies as specified via Yarn",
+  "webpacker:install:react"           => "Installs and setup example React component",
+  "webpacker:install:vue"             => "Installs and setup example Vue component",
+  "webpacker:install:angular"         => "Installs and setup example Angular component",
+  "webpacker:install:elm"             => "Installs and setup example Elm component",
+  "webpacker:install:erb"             => "Installs Erb loader with an example",
+  "webpacker:install:coffee"          => "Installs CoffeeScript loader with an example"
+}.freeze
+
+desc "Lists all available tasks in Webpacker"
+task :webpacker do
+  puts "Available Webpacker tasks are:"
+  tasks.each { |task, message| puts task.ljust(30) + message }
+end

data/lib/tasks/webpacker/check_binstubs.rake

@@ -0,0 +1,12 @@
+namespace :webpacker do
+  desc "Verifies that webpack & webpack-dev-server are present."
+  task :check_binstubs do
+    unless Bundler.which(Gem.win_platform? ? "webpack.bat" : "webpack")
+      $stderr.puts "webpack binstubs not found.\n"\
+           "Have you run rails webpacker:install ?\n"\
+           "Make sure the bin directory or binstubs are not included in .gitignore\n"\
+           "Exiting!"
+      exit!
+    end
+  end
+end

data/lib/tasks/webpacker/check_node.rake

@@ -0,0 +1,24 @@
+namespace :webpacker do
+  desc "Verifies if Node.js is installed"
+  task :check_node do
+    begin
+      node_version = `node -v || nodejs -v`
+      raise Errno::ENOENT if node_version.blank?
+
+      pkg_path = Pathname.new("#{__dir__}/../../../package.json").realpath
+      node_requirement = JSON.parse(pkg_path.read)["engines"]["node"]
+
+      requirement = Gem::Requirement.new(node_requirement)
+      version = Gem::Version.new(node_version.strip.tr("v", ""))
+
+      unless requirement.satisfied_by?(version)
+        $stderr.puts "Webpacker requires Node.js #{requirement} and you are using #{version}"
+        $stderr.puts "Please upgrade Node.js https://nodejs.org/en/download/"
+        $stderr.puts "Exiting!" && exit!
+      end
+    rescue Errno::ENOENT
+      $stderr.puts "Node.js not installed. Please download and install Node.js https://nodejs.org/en/download/"
+      $stderr.puts "Exiting!" && exit!
+    end
+  end
+end

data/lib/tasks/webpacker/check_yarn.rake

@@ -0,0 +1,24 @@
+namespace :webpacker do
+  desc "Verifies if Yarn is installed"
+  task :check_yarn do
+    begin
+      yarn_version = `yarn --version`
+      raise Errno::ENOENT if yarn_version.blank?
+
+      pkg_path = Pathname.new("#{__dir__}/../../../package.json").realpath
+      yarn_requirement = JSON.parse(pkg_path.read)["engines"]["yarn"]
+
+      requirement = Gem::Requirement.new(yarn_requirement)
+      version = Gem::Version.new(yarn_version)
+
+      unless requirement.satisfied_by?(version)
+        $stderr.puts "Webpacker requires Yarn #{requirement} and you are using #{version}"
+        $stderr.puts "Please upgrade Yarn https://yarnpkg.com/lang/en/docs/install/"
+        $stderr.puts "Exiting!" && exit!
+      end
+    rescue Errno::ENOENT
+      $stderr.puts "Yarn not installed. Please download and install Yarn from https://yarnpkg.com/lang/en/docs/install/"
+      $stderr.puts "Exiting!" && exit!
+    end
+  end
+end

data/lib/tasks/webpacker/clobber.rake

@@ -0,0 +1,16 @@
+require "webpacker/configuration"
+
+namespace :webpacker do
+  desc "Remove the webpack compiled output directory"
+  task clobber: ["webpacker:verify_install", :environment] do
+    Webpacker.clobber
+    $stdout.puts "Removed webpack output path directory #{Webpacker.config.public_output_path}"
+  end
+end
+
+# Run clobber if the assets:clobber is run
+if Rake::Task.task_defined?("assets:clobber")
+  Rake::Task["assets:clobber"].enhance do
+    Rake::Task["webpacker:clobber"].invoke
+  end
+end

data/lib/tasks/webpacker/compile.rake

@@ -0,0 +1,41 @@
+$stdout.sync = true
+
+def ensure_log_goes_to_stdout
+  old_logger = Webpacker.logger
+  Webpacker.logger = ActiveSupport::Logger.new(STDOUT)
+  yield
+ensure
+  Webpacker.logger = old_logger
+end
+
+def enhance_assets_precompile
+  Rake::Task["assets:precompile"].enhance do
+    unless Rake::Task.task_defined?("yarn:install")
+      # For Rails < 5.1
+      Rake::Task["webpacker:yarn_install"].invoke
+    end
+    Rake::Task["webpacker:compile"].invoke
+  end
+end
+
+namespace :webpacker do
+  desc "Compile JavaScript packs using webpack for production with digests"
+  task compile: ["webpacker:verify_install", :environment] do
+    ensure_log_goes_to_stdout do
+      if Webpacker.compile
+        # Successful compilation!
+      else
+        # Failed compilation
+        exit!
+      end
+    end
+  end
+end
+
+# Compile packs after we've compiled all other assets during precompilation
+if Rake::Task.task_defined?("assets:precompile")
+  skip_webpacker_precompile = %w(no false n f).include?(ENV["WEBPACKER_PRECOMPILE"])
+  enhance_assets_precompile unless skip_webpacker_precompile
+else
+  Rake::Task.define_task("assets:precompile" => ["webpacker:yarn_install", "webpacker:compile"])
+end

data/lib/tasks/webpacker/install.rake

@@ -0,0 +1,13 @@
+require "active_support/all"
+
+namespace :webpacker do
+  desc "Install Webpacker in this application"
+  task install: [:check_node, :check_yarn] do
+    install_template_path = File.expand_path("../../install/template.rb", __dir__)
+
+    require "rails/generators"
+    require "rails/generators/rails/app/app_generator"
+    generator = Rails::Generators::AppGenerator.new [Jets.root], {force: ENV['FORCE']}, destination_root: Jets.root
+    generator.apply install_template_path, verbose: false
+  end
+end

data/lib/tasks/webpacker/verify_install.rake

@@ -0,0 +1,16 @@
+require "webpacker/configuration"
+
+namespace :webpacker do
+  desc "Verifies if Webpacker is installed"
+  task verify_install: [:check_node, :check_yarn, :check_binstubs] do
+    if Webpacker.config.config_path.exist?
+      $stdout.puts "Webpacker is installed 🎉 🍰"
+      $stdout.puts "Using #{Webpacker.config.config_path} file for setting up webpack paths"
+    else
+      $stderr.puts "Configuration config/webpacker.yml file not found. \n"\
+           "Make sure webpacker:install is run successfully before " \
+           "running dependent tasks"
+      exit!
+    end
+  end
+end