vuejs 1.1.0.beta3 → 1.1.0.beta4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: f07a96eab9a53f20b80be71ef9672976e39834c236da04dd301b0799948ff0c3
4
- data.tar.gz: 48e4f7f78174ceb061fa12740328ffb593a5bc883e5225b826a454047b8516c9
3
+ metadata.gz: f54241575a69ae4937f9e7b47d695e439ef25a86ded0ab9d07d2856e53ed5834
4
+ data.tar.gz: b128c57a407b4456e6d302d37a9c8a79b5aaee7ba8b7457ad410c61d9efba458
5
5
  SHA512:
6
- metadata.gz: '083aaa02c9684dfff34398a87c4ce5d8e1d75df8bf1068de6bfe48477d61a25b79a3dd210da0ff728739a334a25dc366f6a67d823a2e29c9587d5fb3d52d9ba0'
7
- data.tar.gz: b68683e49d0760853c1a3bd97c7d9ee1a95f87c18807f83c081c4ec9ee7687874cede8029ce87be37d2f244870e1239b1a5275e219065d5c01a781b17a209fbc
6
+ metadata.gz: 774610f241c8ee542eed74d99f679f8bbcc00519ecfa0964db7e4ef31ffa32e79084961a50b2b1068a8cbcf748e788019870b0384839fb950aafcafb26be07ec
7
+ data.tar.gz: 003da68ee8e8d575b9199792171624761b1dd326acfa55648ef3f4ebd68108f8028e7432a0f5751038ad8ba7025cae5851b948bb8ab8aeae0714274c5a29acc5
data/README.md CHANGED
@@ -2,29 +2,21 @@
2
2
 
3
3
  > Vue for your favourite Ruby on Rails projects
4
4
 
5
- `vuejs` rubygem makes it easy to get started with Vue on Rails project by shipping the following tools.
6
-
7
- - Vuex support
8
- - HTML Form helper
9
- - Turbolinks support
10
- - Support Webpacker
11
- - Vue component Scaffold
12
- - Mapping to Rails resources
13
- - Auto-loading of Vue component
14
- - Vue-cli service & Vue-ui compatibility
15
- - Unit component tests compatible to vue-tests-utils using Jest
5
+ `vuejs` rubygem makes it easy to get started with Vue on Rails project. To create an empty Vue on Rails project, please run the following command
6
+
7
+ ```
8
+ rails new app -m http://vueonrails.com/vue
9
+ ```
16
10
 
17
11
  ## Installation
18
12
 
19
- Add this line to your application's Gemfile:
13
+ Add this line to your application's Gemfile and run `bundle`
20
14
 
21
15
  ```ruby
22
16
  gem 'vuejs'
23
17
  ```
24
18
 
25
- And then execute:
26
-
27
- $ bundle
19
+ and run `rails vue:setup`
28
20
 
29
21
  ## Get started
30
22
 
@@ -39,11 +31,13 @@ To browse the application template, it's here http://vueonrails.com/vue
39
31
 
40
32
  ## Generate a new Vue component
41
33
 
34
+ To generate a new vue component is easy. Please run the following command:
35
+
42
36
  ```
43
37
  rails generate vue something
44
38
  ```
45
39
 
46
- Note: `vuejs` gem creates vue components as single-file component by default.
40
+ > Note: `vuejs` gem creates vue components as single-file component by default.
47
41
 
48
42
  To generate a component with seperation of concern, please use the option `--seperate`,
49
43
  like `rails g vue something --seperate`
@@ -52,6 +46,7 @@ like `rails g vue something --seperate`
52
46
 
53
47
  ## Destroy a Vue component
54
48
 
49
+ To destroy a vue component is easy. Please run:
55
50
  ```
56
51
  rails destroy vue something
57
52
  ```
@@ -67,6 +62,7 @@ mount Vuejs::engine, to: 'vue'
67
62
  ```
68
63
 
69
64
  ## Generate a Vue component with Turbolinks support
65
+
70
66
  ```
71
67
  rails generate vue something --turbolinks
72
68
  ```
@@ -88,6 +84,9 @@ rails generate vue something --spv
88
84
  ```
89
85
  rails generate vue something --test
90
86
  ```
87
+
88
+ ## Passing Rails Variable into Vue component - coming soon
89
+
91
90
  ---
92
91
 
93
92
  # Some Solution for assets pipeline
@@ -1,6 +1,9 @@
1
- // Generated by Vuejs gem ~> github.com/ytbryan/vuejs
1
+ // Generated by vuejs gem ~> github.com/ytbryan/vuejs
2
+ // To generate another of this component part,
3
+ // Please run `rails generate vue something`
2
4
 
3
5
  export default {
6
+ // props: {},
4
7
  data: function() {
5
8
  return {
6
9
  message: "Hello <%= name %>!",
@@ -20,10 +23,9 @@ export default {
20
23
  },
21
24
  computed: {
22
25
  },
23
- // asyncComputed: {},
24
26
  // components: {},
25
27
  // mixins: [],
26
- // props: {},
27
28
  // directives: {},
28
29
  // filters: {},
30
+ // asyncComputed: {}, // yarn add vue-async-computed
29
31
  };
@@ -1,7 +1,11 @@
1
+ <!-- Generated by vuejs gem ~> github.com/ytbryan/vuejs -->
2
+ <!-- To generate another of this component part,
3
+ Please run `rails generate vue something --seperate` -->
4
+
1
5
  <template>
2
- <div id="app">
6
+ <div id="<%= name %>">
3
7
  <p>{{ message }}</p>
4
- <button @click="onClick">click this</button>
8
+ <!-- <button @click="onClick">click this</button> -->
5
9
  </div>
6
10
  </template>
7
11
 
@@ -1,18 +1,19 @@
1
- // Generated by Vuejs gem ~> github.com/ytbryan/vuejs
2
- // Run this example by adding <%= '<%=' %> javascript_pack_tag "<%= name %>" <%= '%' %><%= '>' %> into your
3
- // rails' view
4
- // To generate another of this component, please run `rails g vue something`
1
+ //Generated by Vuejs gem ~> github.com/ytbryan/vuejs
2
+ //Run this example by adding <%%= javascript_pack_tag "<%= name %>" %> into your
3
+ //Rails' view
4
+ //To generate another component part, please run `rails generate vue something`
5
5
 
6
6
  import Vue from 'vue'
7
- <% if options['seperate'] %>
7
+ <% if options['seperate'] -%>
8
8
  import App from '../parts/<%= name %>/<%= name %>.vue'
9
- <% else %>
9
+ <% else -%>
10
10
  import App from '../parts/<%= name %>.vue'
11
- <% end %>
11
+ <% end -%>
12
+
12
13
  document.addEventListener('DOMContentLoaded', () => {
13
- document.body.appendChild(document.createElement('hello'))
14
- const app = new Vue({
14
+ document.body.appendChild(document.createElement('<%= name %>'))
15
+ const <%= name %> = new Vue({
15
16
  render: h => h(App)
16
- }).$mount('hello')
17
- console.log({app})
17
+ }).$mount('<%= name %>')
18
+ console.log({<%= name %>})
18
19
  })
@@ -1,14 +1,16 @@
1
1
  <!-- Generated by vuejs gem ~> github.com/ytbryan/vuejs -->
2
+ <!-- To generate another component part, Please run `rails generate vue something` -->
2
3
 
3
- <template>
4
- <div id="app">
4
+ <template>
5
+ <div id="<%= name %>">
5
6
  <p>{{ message }}</p>
6
- <button @click="onClick">click this</button>
7
+ <!-- <button @click="onClick">click this</button> -->
7
8
  </div>
8
9
  </template>
9
10
 
10
11
  <script>
11
12
  export default {
13
+ // props: {},
12
14
  data: function () {
13
15
  return {
14
16
  message: "Hello <%= name %>!"
@@ -28,12 +30,11 @@ export default {
28
30
  computed: {
29
31
 
30
32
  },
31
- // asyncComputed: {},
32
33
  // components: {},
33
34
  // mixins: [],
34
- // props: {},
35
35
  // directives: {},
36
36
  // filters: {},
37
+ // asyncComputed: {},
37
38
  }
38
39
  </script>
39
40
 
@@ -0,0 +1,16 @@
1
+ "jest": {
2
+ "moduleFileExtensions": [
3
+ "js",
4
+ "vue"
5
+ ],
6
+ "moduleNameMapper": {
7
+ "^@/(.*)$": "<rootDir>/app/javascript/parts/$1",
8
+ },
9
+ "transform": {
10
+ "^.+\\.js$": "<rootDir>/node_modules/babel-jest",
11
+ ".*\\.(vue)$": "<rootDir>/node_modules/vue-jest"
12
+ },
13
+ "snapshotSerializers": [
14
+ "<rootDir>/node_modules/jest-serializer-vue"
15
+ ]
16
+ }
@@ -0,0 +1,7 @@
1
+ "env": {
2
+ "test": {
3
+ "presets": [
4
+ ["env", { "targets": { "node": "current" }}]
5
+ ]
6
+ }
7
+ }
@@ -1,23 +1,18 @@
1
1
  // Generated by vuejs gem ~> github.com/ytbryan/vuejs
2
- // To generate another component with test, please run `rails g vue something --test`
2
+ // To generate another component part with test,
3
+ // please run `rails generate vue something --test`
3
4
 
4
5
  import { shallowMount } from '@vue/test-utils'
5
- import List from '../parts/<%= name %>/<%= name %>.vue'
6
+ <% if options['seperate'] -%>
7
+ import App from '@/<%= name %>/<%= name %>.vue'
8
+ <% else -%>
9
+ import App from '@/<%= name %>.vue'
10
+ <% end -%>
6
11
 
7
12
  describe('<%= name %>.vue', () => {
8
- it('renders li for each item in props.items', () => {
9
- const items = ['1', '2']
10
- const wrapper = shallowMount(List, {
11
- propsData: { items }
12
- })
13
- expect(wrapper.findAll('li')).toHaveLength(items.length)
14
- })
15
-
16
- it('matches snapshot', () => {
17
- const items = ['item 1', 'item 2']
18
- const wrapper = shallowMount(List, {
19
- propsData: { items }
20
- })
21
- expect(wrapper.html()).toMatchSnapshot()
13
+ it('render hello <%= name %>', () => {
14
+ const message = "Hello <%= name %>!"
15
+ const wrapper = shallowMount(App)
16
+ expect(wrapper.find('#<%= name %>').text()).toBe(message)
22
17
  })
23
18
  })
@@ -1,21 +1,22 @@
1
1
  // Generated by Vuejs gem ~> github.com/ytbryan/vuejs
2
- // Run this example by adding <%= '<%=' %> javascript_pack_tag "<%= name %>" <%= '%' %><%= '>' %> into your
3
- // rails' view
4
- // To generate another of this component with turbolinks, please run `rails g vue something --turbolinks`
2
+ // Run this example by adding <%%= javascript_pack_tag "<%= name %>" %> into your
3
+ // Rails' view
4
+ // To generate another component part with turbolinks, please run `rails generate vue something --turbolinks`
5
5
 
6
6
  import TurbolinksAdapter from 'vue-turbolinks';
7
7
  import Vue from 'vue.esm'
8
- <% if options[:single] %>
9
- import App from '../parts/<%= name %>.vue'
10
- <% else %>
8
+ <% if options['seperate'] -%>
11
9
  import App from '../parts/<%= name %>/<%= name %>.vue'
12
- <% end %>
10
+ <% else -%>
11
+ import App from '../parts/<%= name %>.vue'
12
+ <% end -%>
13
13
  Vue.use(TurbolinksAdapter)
14
+
14
15
  document.addEventListener('turbolinks:load', () => {
15
16
  if(isView("###")){
16
- const app = new Vue({
17
+ const <%= name %> = new Vue({
17
18
  render: h => h(App)
18
- }).$mount('#something')
19
- console.log({app})
19
+ }).$mount('#<%= name %>')
20
+ console.log({<%= name %>})
20
21
  }
21
22
  })
@@ -37,6 +37,9 @@ class VueGenerator < Rails::Generators::NamedBase
37
37
 
38
38
  def add_tests_to_component name
39
39
  template "tests/unit.test.js.erb", "#{TESTS_PATH}/#{name}.test.js"
40
+
41
+ say "adding vue-test-utils and other Jest dependencies"
42
+ run "yarn add @vue/test-utils jest-serializer-vue vue-jest babel-jest"
40
43
  end
41
44
 
42
45
  def add_helpers_to_component name
data/lib/install/alias.rb CHANGED
@@ -1,7 +1,7 @@
1
1
  say "Adding alias.js to config/webpack/alias"
2
2
  copy_file "#{__dir__}/config/alias.js", Rails.root.join("config/webpack/alias/alias.js").to_s
3
3
 
4
- say "Adding alias to config/webpack/environment.js"
4
+ say "Adding alias configuration to config/webpack/environment.js"
5
5
  insert_into_file Rails.root.join("config/webpack/environment.js").to_s,
6
6
  "const alias = require('./alias/alias')\n",
7
7
  after: "require('@rails/webpacker')\n"
data/lib/install/setup.rb CHANGED
@@ -10,18 +10,50 @@ insert_into_file Rails.root.join("config/webpack/environment.js").to_s,
10
10
  "environment.config.merge(alias)\n",
11
11
  before: "module.exports"
12
12
 
13
- say "Adding vue-autorequest and vue-form-for"
14
- run "yarn add vue-autorequest vue-form-for"
15
-
16
- say "Adding Vuex"
17
- run "yarn add vuex vuex-rails-plugin"
18
-
19
- say "Adding tests"
20
- run "yarn add @vue/test-utils"
21
-
22
- say "Adding turbolinks"
23
- run "yarn add vue-turbolinks"
24
-
25
- say "Making Vue on Rails compatible with Vue-ui"
13
+ scripts = <<-eos
14
+ "scripts": {
15
+ "test": "jest",
16
+ "assets:precompile": "yarn install; rails assets:precompile",
17
+ "webpack-dev-server": "./bin/webpack-dev-server",
18
+ "rails server": "rails server",
19
+ "yarn install": "yarn install"
20
+ },
21
+ "jest": {
22
+ "moduleFileExtensions": [
23
+ "js",
24
+ "vue"
25
+ ],
26
+ "moduleNameMapper": {
27
+ "^@/(.*)$": "<rootDir>/app/javascript/parts/$1"
28
+ },
29
+ "transform": {
30
+ "^.+\\\\\\.js$": "<rootDir>/node_modules/babel-jest",
31
+ ".*\\\\\\.(vue)$": "<rootDir>/node_modules/vue-jest"
32
+ },
33
+ "snapshotSerializers": [
34
+ "<rootDir>/node_modules/jest-serializer-vue"
35
+ ]
36
+ },
37
+ eos
38
+
39
+ say "Adding scripts and jest configuration to package.json"
40
+ insert_into_file Rails.root.join("package.json").to_s,
41
+ "#{scripts}",
42
+ after: "\"private\": true,\n"
43
+
44
+ say "Adding test presets to .babelrc"
45
+ babelrc = <<-eos
46
+ "test": {
47
+ "presets": [
48
+ ["env", { "targets": { "node": "current" }}]
49
+ ]
50
+ },
51
+ eos
52
+
53
+ insert_into_file Rails.root.join(".babelrc").to_s,
54
+ "#{babelrc}",
55
+ before: " \"presets\": ["
56
+
57
+ say "Adding @vue/cli-service to make Vue-ui compatible"
26
58
  run "yarn add @vue/cli-service --dev"
27
-
59
+
data/lib/install/test.rb CHANGED
@@ -1 +1,46 @@
1
- template "tests/unit.test.js.erb", "#{TESTS_PATH}/#{name}.test.js"
1
+ scripts = <<-eos
2
+ "scripts": {
3
+ "test": "jest",
4
+ "assets:precompile": "yarn install; rails assets:precompile",
5
+ "webpack-dev-server": "./bin/webpack-dev-server",
6
+ "rails server": "rails server",
7
+ "yarn install": "yarn install"
8
+ },
9
+ "jest": {
10
+ "moduleFileExtensions": [
11
+ "js",
12
+ "vue"
13
+ ],
14
+ "moduleNameMapper": {
15
+ "^@/(.*)$": "<rootDir>/app/javascript/parts/$1"
16
+ },
17
+ "transform": {
18
+ "^.+\\\\\\.js$": "<rootDir>/node_modules/babel-jest",
19
+ ".*\\\\\\.(vue)$": "<rootDir>/node_modules/vue-jest"
20
+ },
21
+ "snapshotSerializers": [
22
+ "<rootDir>/node_modules/jest-serializer-vue"
23
+ ]
24
+ },
25
+ eos
26
+
27
+ say "Adding scripts and jest configuration to package.json"
28
+ insert_into_file Rails.root.join("package.json").to_s,
29
+ "#{scripts}",
30
+ after: "\"private\": true,\n"
31
+
32
+ say "Adding test presets to .babelrc"
33
+ babelrc = <<-eos
34
+ "test": {
35
+ "presets": [
36
+ ["env", { "targets": { "node": "current" }}]
37
+ ]
38
+ },
39
+ eos
40
+
41
+ insert_into_file Rails.root.join(".babelrc").to_s,
42
+ "#{babelrc}",
43
+ before: " \"presets\": ["
44
+
45
+ say "Adding @vue/test-util and other Jest dependencies"
46
+ run "yarn add jest-serializer-vue vue-jest babel-jest"
data/lib/install/ui.rb CHANGED
@@ -0,0 +1,2 @@
1
+ say "Adding @vue/cli-service to make Vue-ui compatible"
2
+ run "yarn add @vue/cli-service --dev"
data/lib/install/vuex.rb CHANGED
@@ -1,4 +1,5 @@
1
- run "yarn add vuex"
1
+ say "Adding Vuex & Vuex Rails Plugins to Vue on Rails"
2
+ run "yarn add vuex vuex-rails-plugins"
2
3
 
3
4
  insert_into_file "#{PACKS_PATH}/#{name}.js" ,
4
5
  "import Vuex from 'vuex'",
data/lib/tasks/info.rake CHANGED
@@ -3,7 +3,7 @@ namespace :vue do
3
3
  task :info do
4
4
  $stdout.puts "Ruby: #{`ruby --version`}"
5
5
  $stdout.puts "Rails: #{Rails.version}"
6
- # $stdout.puts "Webpacker: #{Webpacker::VERSION}"
6
+ # $stdout.puts "Webpacker: #{Webpacker::VERSION}"
7
7
  $stdout.puts "Node: #{`node --version`}"
8
8
  $stdout.puts "Yarn: #{`yarn --version`}"
9
9
  $stdout.puts "\n"
data/lib/tasks/setup.rake CHANGED
@@ -13,32 +13,55 @@ namespace :vue do
13
13
  exec "#{base_path} LOCATION=#{template}"
14
14
  end
15
15
 
16
- desc "install other plugins"
17
- task :others do
18
- $stdout.puts "#{`yarn add @vue/cli-plugin-babel
19
- @vue/cli-plugin-eslint
20
- @vue/cli-plugin-unit-jest
21
- @vue/cli-plugin-pwa
22
- vue-i18n`}"
23
- end
24
-
25
16
  desc "install turbolinks"
26
17
  task :turbolinks do
27
- $stdout.puts "#{`yarn add vue-turbolinks`}"
18
+ template = File.expand_path("../install/turbolinks.rb", __dir__)
19
+ base_path =
20
+ if Rails::VERSION::MAJOR >= 5
21
+ "#{RbConfig.ruby} #{bin_path}/rails app:template"
22
+ else
23
+ "#{RbConfig.ruby} #{bin_path}/rake rails:template"
24
+ end
25
+
26
+ exec "#{base_path} LOCATION=#{template}"
28
27
  end
29
28
 
30
- desc "install vue-test-utils"
29
+ desc "setup Vue on Rails to be ready for Jest tests"
31
30
  task :test do
32
- $stdout.puts "#{`yarn add @vue/test-utils`}"
31
+ template = File.expand_path("../install/test.rb", __dir__)
32
+ base_path =
33
+ if Rails::VERSION::MAJOR >= 5
34
+ "#{RbConfig.ruby} #{bin_path}/rails app:template"
35
+ else
36
+ "#{RbConfig.ruby} #{bin_path}/rake rails:template"
37
+ end
38
+
39
+ exec "#{base_path} LOCATION=#{template}"
33
40
  end
34
41
 
35
- desc "install Vuex"
42
+ desc "install Vuex and vuex-rails-plugins"
36
43
  task :vuex do
37
- $stdout.puts "#{`yarn add vuex`}"
44
+ template = File.expand_path("../install/vuex.rb", __dir__)
45
+ base_path =
46
+ if Rails::VERSION::MAJOR >= 5
47
+ "#{RbConfig.ruby} #{bin_path}/rails app:template"
48
+ else
49
+ "#{RbConfig.ruby} #{bin_path}/rake rails:template"
50
+ end
51
+
52
+ exec "#{base_path} LOCATION=#{template}"
38
53
  end
39
54
 
40
55
  desc "make this Rails project Vue-ui compatible"
41
56
  task :ui do
42
- $stdout.puts "yarn add @vue/cli-service --dev"
57
+ template = File.expand_path("../install/ui.rb", __dir__)
58
+ base_path =
59
+ if Rails::VERSION::MAJOR >= 5
60
+ "#{RbConfig.ruby} #{bin_path}/rails app:template"
61
+ else
62
+ "#{RbConfig.ruby} #{bin_path}/rake rails:template"
63
+ end
64
+
65
+ exec "#{base_path} LOCATION=#{template}"
43
66
  end
44
67
  end
@@ -1,4 +1,4 @@
1
1
  module Log
2
- MESSAGE = "Send me Pull Request ->
2
+ MESSAGE = "Send me pull request ~>
3
3
  https://github.com/ytbryan/vuejs/pulls"
4
4
  end
data/lib/vuejs/version.rb CHANGED
@@ -1,3 +1,3 @@
1
1
  module Vuejs
2
- VERSION = "1.1.0.beta3"
2
+ VERSION = "1.1.0.beta4"
3
3
  end
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: vuejs
3
3
  version: !ruby/object:Gem::Version
4
- version: 1.1.0.beta3
4
+ version: 1.1.0.beta4
5
5
  platform: ruby
6
6
  authors:
7
7
  - Bryan Lim
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2018-09-07 00:00:00.000000000 Z
11
+ date: 2018-09-10 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: bundler
@@ -57,6 +57,8 @@ files:
57
57
  - lib/generators/generator_templates/packs/index.vue
58
58
  - lib/generators/generator_templates/packs/pack.js.erb
59
59
  - lib/generators/generator_templates/sfc/single-file-component.vue
60
+ - lib/generators/generator_templates/tests/jest.package.json
61
+ - lib/generators/generator_templates/tests/test.babelrc
60
62
  - lib/generators/generator_templates/tests/unit.test.js.erb
61
63
  - lib/generators/generator_templates/turbolinks/turbolinks-pack.js.erb
62
64
  - lib/generators/generator_templates/vuex/index.js
@@ -66,7 +68,6 @@ files:
66
68
  - lib/install/component_with_seperate_concern.rb
67
69
  - lib/install/config/alias.js
68
70
  - lib/install/setup.rb
69
- - lib/install/single-file-component.rb
70
71
  - lib/install/test.rb
71
72
  - lib/install/turbolinks.rb
72
73
  - lib/install/ui.rb
@@ -98,7 +99,7 @@ homepage: http://github.com/ytbryan/vuejs
98
99
  licenses:
99
100
  - MIT
100
101
  metadata: {}
101
- post_install_message: "Send me Pull Request -> \n https://github.com/ytbryan/vuejs/pulls"
102
+ post_install_message: "Send me pull request ~> \n https://github.com/ytbryan/vuejs/pulls"
102
103
  rdoc_options: []
103
104
  require_paths:
104
105
  - lib
File without changes