opal-webpack-loader 0.11.2 → 0.13.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +212 -216
- data/bin/opal-webpack-compile-server +0 -1
- data/bin/opal-webpack-windows-compile-server +7 -4
- data/bin/owl-compiler +7 -4
- data/lib/opal-webpack-loader/installer_cli.rb +415 -415
- data/lib/opal-webpack-loader/templates/application.css.erb +4 -4
- data/lib/opal-webpack-loader/templates/debug.js.erb +149 -150
- data/lib/opal-webpack-loader/templates/development.js.erb +134 -135
- data/lib/opal-webpack-loader/templates/opal_loader.rb.erb +7 -9
- data/lib/opal-webpack-loader/templates/opal_web_worker_loader.rb.erb +7 -9
- data/lib/opal-webpack-loader/templates/package.json.erb +25 -26
- data/lib/opal-webpack-loader/templates/production.js.erb +97 -99
- data/lib/opal-webpack-loader/version.rb +1 -1
- metadata +20 -34
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: cc5914067754fe1f6d786cc52fa6b8dd4b108e1898ddb31427924bf60829296d
|
4
|
+
data.tar.gz: 7a9de1f8a01a248fb2d444b5445e6414fb6cb23d2dfef935265bb59f501c46dc
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 63b4a676870b612482f63b59e1fc9d66ab068d2850cb7f9ba0fba72ca5a1daa47501275b8d2f6afc269d6862bee6778114e102b0c97760568448a2096b2eee1f
|
7
|
+
data.tar.gz: 43754aaa9a65903c7eb481a0909e9e36c5feab93d3060903960f5dc5299696ac6683715c61f7b83733bfda0116fc4dcb015c9a37422132be2cbf2cc39a5adaa1
|
data/README.md
CHANGED
@@ -1,216 +1,212 @@
|
|
1
|
-
<h1 align="center">
|
2
|
-
<img src="https://raw.githubusercontent.com/isomorfeus/opal-webpack-loader/master/docs/owl.png"
|
3
|
-
align="center" title="Opal logo by Elia Schito combined with Webpack Logo" width="111" height="125" />
|
4
|
-
<br/>
|
5
|
-
opal-webpack-loader<br/>
|
6
|
-
<img src="https://img.shields.io/badge/Opal-Ruby%20💛%20JavaScript%20💛%20Webpack-yellow.svg?logo=ruby&style=social&logoColor=777"/>
|
7
|
-
</h1>
|
8
|
-
|
9
|
-
Bundle assets with webpack, resolve and compile opal ruby files and import them in the bundle, without sprockets or the webpacker gem
|
10
|
-
(but can be used with both of them too).
|
11
|
-
Includes a loader and resolver plugin for webpack.
|
12
|
-
|
13
|
-
### Community and Support
|
14
|
-
At the [Isomorfeus Framework Project](http://isomorfeus.com)
|
15
|
-
|
16
|
-
### Tested
|
17
|
-
[TravisCI](https://travis-ci.org): [![Build Status](https://travis-ci.org/isomorfeus/opal-webpack-loader.svg?branch=master)](https://travis-ci.org/isomorfeus/opal-webpack-loader)
|
18
|
-
|
19
|
-
### Features
|
20
|
-
- comes with a installer for rails and other frameworks
|
21
|
-
- webpack based build process
|
22
|
-
- very fast, asynchronous and parallel builds of opal code:
|
23
|
-
opal-webpack-loader-0.7.1 compiles all of opal, a bunch of gems and over 19000SLC on a
|
24
|
-
Intel® Core™ i7-7700HQ CPU @ 2.80GHz × 8, with 8 workers in around 1850ms
|
25
|
-
- support for memcached or redis as compiler cache
|
26
|
-
- fast builds on windows too, parallel when building multiple assets with parallel-webpack
|
27
|
-
- opal modules are packaged as es6 modules
|
28
|
-
- support for rails with webpacker
|
29
|
-
- other webpack features become available, like:
|
30
|
-
- source maps
|
31
|
-
- multiple targets: web (for browsers), node (for server side rendering) and webworker (for Web Workers)
|
32
|
-
- hot module reloading for opal ruby code and stylesheets and html views
|
33
|
-
- tree shaking
|
34
|
-
- code splitting
|
35
|
-
- lazy loading
|
36
|
-
- everything else webpack can do, like loading stylesheets, etc.
|
37
|
-
|
38
|
-
### Requirements
|
39
|
-
- npm or yarn
|
40
|
-
- opal-webpack-loader consists of 2 parts, the npm package and the gem, both are required and must be the same version.
|
41
|
-
- webpack ^
|
42
|
-
- webpack-dev-server
|
43
|
-
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
- [
|
69
|
-
- [
|
70
|
-
|
71
|
-
###
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
|
78
|
-
|
79
|
-
|
80
|
-
|
81
|
-
|
82
|
-
|
83
|
-
|
84
|
-
|
85
|
-
|
86
|
-
|
87
|
-
|
88
|
-
|
89
|
-
- **
|
90
|
-
|
91
|
-
|
92
|
-
|
93
|
-
|
94
|
-
|
95
|
-
|
96
|
-
|
97
|
-
|
98
|
-
|
99
|
-
```javascript
|
100
|
-
module.exports = [ browser ];
|
101
|
-
```
|
102
|
-
|
103
|
-
|
104
|
-
|
105
|
-
|
106
|
-
|
107
|
-
|
108
|
-
|
109
|
-
|
110
|
-
|
111
|
-
|
112
|
-
|
113
|
-
####
|
114
|
-
|
115
|
-
|
116
|
-
|
117
|
-
|
118
|
-
|
119
|
-
For rails like applications
|
120
|
-
|
121
|
-
|
122
|
-
|
123
|
-
|
124
|
-
|
125
|
-
|
126
|
-
|
127
|
-
|
128
|
-
|
129
|
-
|
130
|
-
|
131
|
-
|
132
|
-
###
|
133
|
-
|
134
|
-
|
135
|
-
|
136
|
-
|
137
|
-
|
138
|
-
|
139
|
-
|
140
|
-
|
141
|
-
|
142
|
-
|
143
|
-
|
144
|
-
```
|
145
|
-
|
146
|
-
|
147
|
-
|
148
|
-
|
149
|
-
|
150
|
-
|
151
|
-
|
152
|
-
|
153
|
-
|
154
|
-
|
155
|
-
|
156
|
-
|
157
|
-
|
158
|
-
|
159
|
-
|
160
|
-
|
161
|
-
|
162
|
-
|
163
|
-
|
164
|
-
|
165
|
-
|
166
|
-
|
167
|
-
require
|
168
|
-
|
169
|
-
Bundler.require(:default, :
|
170
|
-
|
171
|
-
|
172
|
-
|
173
|
-
|
174
|
-
|
175
|
-
|
176
|
-
|
177
|
-
|
178
|
-
|
179
|
-
|
180
|
-
|
181
|
-
```ruby
|
182
|
-
OpalWebpackLoader.
|
183
|
-
```
|
184
|
-
|
185
|
-
```ruby
|
186
|
-
OpalWebpackLoader.
|
187
|
-
```
|
188
|
-
|
189
|
-
|
190
|
-
|
191
|
-
|
192
|
-
|
193
|
-
|
194
|
-
|
195
|
-
|
196
|
-
|
197
|
-
|
198
|
-
|
199
|
-
```
|
200
|
-
|
201
|
-
|
202
|
-
|
203
|
-
|
204
|
-
|
205
|
-
|
206
|
-
```
|
207
|
-
|
208
|
-
|
209
|
-
|
210
|
-
|
211
|
-
|
212
|
-
|
213
|
-
### Tests
|
214
|
-
- clone the repo
|
215
|
-
- `bundle install`
|
216
|
-
- `bundle exec rspec`
|
1
|
+
<h1 align="center">
|
2
|
+
<img src="https://raw.githubusercontent.com/isomorfeus/opal-webpack-loader/master/docs/owl.png"
|
3
|
+
align="center" title="Opal logo by Elia Schito combined with Webpack Logo" width="111" height="125" />
|
4
|
+
<br/>
|
5
|
+
opal-webpack-loader<br/>
|
6
|
+
<img src="https://img.shields.io/badge/Opal-Ruby%20💛%20JavaScript%20💛%20Webpack-yellow.svg?logo=ruby&style=social&logoColor=777"/>
|
7
|
+
</h1>
|
8
|
+
|
9
|
+
Bundle assets with webpack, resolve and compile opal ruby files and import them in the bundle, without sprockets or the webpacker gem
|
10
|
+
(but can be used with both of them too).
|
11
|
+
Includes a loader and resolver plugin for webpack.
|
12
|
+
|
13
|
+
### Community and Support
|
14
|
+
At the [Isomorfeus Framework Project](http://isomorfeus.com)
|
15
|
+
|
16
|
+
### Tested
|
17
|
+
[TravisCI](https://travis-ci.org): [![Build Status](https://travis-ci.org/isomorfeus/opal-webpack-loader.svg?branch=master)](https://travis-ci.org/isomorfeus/opal-webpack-loader)
|
18
|
+
|
19
|
+
### Features
|
20
|
+
- comes with a installer for rails and other frameworks
|
21
|
+
- webpack based build process
|
22
|
+
- very fast, asynchronous and parallel builds of opal code:
|
23
|
+
opal-webpack-loader-0.7.1 compiles all of opal, a bunch of gems and over 19000SLC on a
|
24
|
+
Intel® Core™ i7-7700HQ CPU @ 2.80GHz × 8, with 8 workers in around 1850ms
|
25
|
+
- support for memcached or redis as compiler cache
|
26
|
+
- fast builds on windows too, parallel when building multiple assets with parallel-webpack
|
27
|
+
- opal modules are packaged as es6 modules
|
28
|
+
- support for rails with webpacker
|
29
|
+
- other webpack features become available, like:
|
30
|
+
- source maps
|
31
|
+
- multiple targets: web (for browsers), node (for server side rendering) and webworker (for Web Workers)
|
32
|
+
- hot module reloading for opal ruby code and stylesheets and html views
|
33
|
+
- tree shaking
|
34
|
+
- code splitting
|
35
|
+
- lazy loading
|
36
|
+
- everything else webpack can do, like loading stylesheets, etc.
|
37
|
+
|
38
|
+
### Requirements
|
39
|
+
- npm or yarn
|
40
|
+
- opal-webpack-loader consists of 2 parts, the npm package and the gem, both are required and must be the same version.
|
41
|
+
- webpack ^5.50
|
42
|
+
- optional webpack-dev-server ^^4.0.0-rc.0 for development configurations
|
43
|
+
- the ES6 modules branch of opal
|
44
|
+
|
45
|
+
- [PR#2266](https://github.com/opal/opal/pull/2266),
|
46
|
+
based on Opal 1.2.0 using javascript string primitives and providing nice features like `require_lazy 'my_module'`
|
47
|
+
|
48
|
+
`gem 'opal', github: 'janbiedermann/opal', branch: 'es6_modules_1_2'`
|
49
|
+
|
50
|
+
- if you have the webpacker gem installed somewhere, it should be a version supporting webpack 4
|
51
|
+
- ruby, version 2.5 or higher recommended
|
52
|
+
- bundler, latest version recommended
|
53
|
+
|
54
|
+
### Installation
|
55
|
+
|
56
|
+
#### Using the installer
|
57
|
+
First install the gem:
|
58
|
+
```
|
59
|
+
gem install 'opal-webpack-loader'
|
60
|
+
```
|
61
|
+
|
62
|
+
Continue here:
|
63
|
+
- [Install for Rails like projects](https://github.com/isomorfeus/opal-webpack-loader/blob/master/docs/installation_rails.md)
|
64
|
+
- [Install for Cuba, Roda, Sinatra and other projects with a flat structure](https://github.com/isomorfeus/opal-webpack-loader/blob/master/docs/installation_flat.md)
|
65
|
+
- [Manual Installation](https://github.com/isomorfeus/opal-webpack-loader/blob/master/docs/installation_manual.md)
|
66
|
+
|
67
|
+
### Example applications
|
68
|
+
- [Are here](https://github.com/isomorfeus/opal-webpack-loader/tree/master/example_apps/)
|
69
|
+
- A minimal webpack only example from @sunrick is [here](https://github.com/sunrick/opal-hello-world-webpack).
|
70
|
+
|
71
|
+
### General Usage without Webpacker
|
72
|
+
|
73
|
+
After installing owl with the installer, three scripts are provided in package.json:
|
74
|
+
- `development` - runs the webpack-dev-server, use for general development, provides fast reloads, entry is application.js
|
75
|
+
- `debug` - runs the webpack-dev-server, use for debugging, provides source maps, entry is application_debug.js. Additional debugging tools may be added there.
|
76
|
+
- `production_build` - runs webpack to build assets for production, entry is application.js
|
77
|
+
|
78
|
+
These scripts can for example be run with:
|
79
|
+
`yarn run debug` or `npm run debug`
|
80
|
+
|
81
|
+
The default config provides several targets and entries:
|
82
|
+
|
83
|
+
- **Browser**: the webpack target is 'web' and the javascript entry file for imports is `application.js` - general use for the application with all
|
84
|
+
browser features, the opal ruby entry file is `opal_loader.rb` in the opal or app/opal directory of the app.
|
85
|
+
- **Server Side Rendering**: the webpack target is `node` and the javascript entry file for imports is `application_ssr.js` - general use for the
|
86
|
+
application server side rendering, several Browser features are unavailable, no `window`, no `document`, some node features are available,
|
87
|
+
like `Buffer`, the opal ruby entry file is `opal_loader.rb` in the opal or app/opal directory of the app.
|
88
|
+
(meant to be used with isomorfeus-speednode, standard ExecJS limitations prevent certain webpack features)
|
89
|
+
- **Web Worker**: the webpack target is 'webworker' and the javascript entry file for imports is `application_webworker.js` - used to initialize Web
|
90
|
+
Workers in the browser, the opal ruby entry file is `opal_webworker_loader.rb` in the opal or app/opal directory of the app.
|
91
|
+
|
92
|
+
Only the browser target is build by default. To builds the other target, just add the needed targets to the last line of the webpack config,
|
93
|
+
for example to `development.js`:
|
94
|
+
default config:
|
95
|
+
```javascript
|
96
|
+
module.exports = [ browser ];
|
97
|
+
```
|
98
|
+
modified config with ssr and web_worker targets enabled:
|
99
|
+
```javascript
|
100
|
+
module.exports = [ browser, ssr, web_worker ];
|
101
|
+
```
|
102
|
+
Same works for the `debug.js` and `production.js` webpack config files.
|
103
|
+
|
104
|
+
Also a Procfile has been installed, for rails its easy to startup rails and webpack with foreman:
|
105
|
+
`foreman start` (`gem install foreman` if you dont have it already). It will start rails and webpack-dev-server with the development script.
|
106
|
+
|
107
|
+
For non rails installation check the Procfile and add a starter for your app.
|
108
|
+
|
109
|
+
#### Opal Ruby Application Files
|
110
|
+
For rails installations with the installer they all go into: `app/opal`, for flat installations in the `opal` directory.
|
111
|
+
In this directory there already is a `opal_loader.rb` which is the entry point for your app.
|
112
|
+
|
113
|
+
#### Stylesheets
|
114
|
+
Stylesheets are hot reloaded too with the default config installed by the installer. Also they are imported into application.js by default.
|
115
|
+
For rails like applications stylesheets are in `app/assets/stylesheets/application.css`, for flat applications they are in `styles/application.css`.
|
116
|
+
SCSS is supported too by the default config.
|
117
|
+
|
118
|
+
#### Views
|
119
|
+
For rails like applications a watcher for `app/views` is installed by default. The watcher will trigger a page reload when views are changed.
|
120
|
+
For flat applications nothing is configured by default, as there are to many ways to generate views, they are not even needed with
|
121
|
+
frameworks like isomorfeus. Instead the section for configuring a view watcher is included in the development.js and debug.js webpack
|
122
|
+
config, but it is commented out. Please see those files and adjust to your liking.
|
123
|
+
|
124
|
+
#### Parallel compilation for speed
|
125
|
+
|
126
|
+
Since version 0.8.0 the number of CPUs is automatically determined and a appropriate number of of compile server workers is started automatically.
|
127
|
+
|
128
|
+
### Source Maps
|
129
|
+
|
130
|
+
[Source Maps](https://github.com/isomorfeus/opal-webpack-loader/blob/master/docs/source_maps.md)
|
131
|
+
|
132
|
+
### Hot Module Reloading
|
133
|
+
[Hot Module Reloading](https://github.com/isomorfeus/opal-webpack-loader/blob/master/docs/hot_module_reloading.md)
|
134
|
+
|
135
|
+
### Opal Load Path
|
136
|
+
The projects directory for opal ruby files must be in the opal load path. This is done in the initializer for rails apps in
|
137
|
+
config/initializers/opal_webpack_loader.rb or in 'owl_init.rb' for non rails apps, for example:
|
138
|
+
```ruby
|
139
|
+
Opal.append_path(File.realdirpath('app/opal'))
|
140
|
+
```
|
141
|
+
|
142
|
+
### View Helper
|
143
|
+
In Rails or frameworks that support `javscript_include_tag`, add to the app/helpers/application_helper.rb
|
144
|
+
```ruby
|
145
|
+
module ApplicationHelper
|
146
|
+
include OpalWebpackLoader::RailsViewHelper
|
147
|
+
```
|
148
|
+
in other frameworks that dont have a `javascript_include_tag`:
|
149
|
+
```ruby
|
150
|
+
module MyProjectsViewThings
|
151
|
+
include OpalWebpackLoader::ViewHelper
|
152
|
+
```
|
153
|
+
|
154
|
+
Then you can use in your views:
|
155
|
+
```ruby
|
156
|
+
owl_script_tag('application.js')
|
157
|
+
```
|
158
|
+
#### Compile Server and app_loader.rb
|
159
|
+
For non rails projects, determining Opal load paths, for the resolver and compile server to work properly, may not be obvious. For these cases
|
160
|
+
a file `app_loader.rb` in the projects root can be created which just loads all requirements without starting anything.
|
161
|
+
Usually it would just setup bundler with the appropriate options, for example:
|
162
|
+
```ruby
|
163
|
+
require 'bundler/setup'
|
164
|
+
if ENV['RACK_ENV'] && ENV['RACK_ENV'] == 'test'
|
165
|
+
Bundler.require(:default, :test)
|
166
|
+
elsif ENV['RACK_ENV'] && ENV['RACK_ENV'] == 'production'
|
167
|
+
Bundler.require(:default, :production)
|
168
|
+
else
|
169
|
+
Bundler.require(:default, :development)
|
170
|
+
end
|
171
|
+
Opal.append_path(File.realdirpath('opal')) # this is a good place to add the directory with opal files to the opal load path
|
172
|
+
```
|
173
|
+
When this file exists, the compile server will load it and generate Opal load paths accordingly for the resolver.
|
174
|
+
|
175
|
+
#### Project configuration options for the view helper
|
176
|
+
These setting are in the initializer in config/initializers/opal_webpack_loader.rb for rails like apps, or owl_init.rb for others.
|
177
|
+
```ruby
|
178
|
+
OpalWebpackLoader.use_manifest = false
|
179
|
+
```
|
180
|
+
If the manifest file should be used, use_manifest should be true.
|
181
|
+
```ruby
|
182
|
+
OpalWebpackLoader.manifest_path = File.join(Dir.getwd, 'public', 'assets', 'manifest.json')
|
183
|
+
```
|
184
|
+
Sets the path to the webpack (with the [webpack-manifest-plugin](https://www.npmjs.com/package/webpack-manifest-plugin)) generated manifest.json to look up assets.
|
185
|
+
```ruby
|
186
|
+
OpalWebpackLoader.client_asset_path = 'http://localhost:3035/assets/'
|
187
|
+
```
|
188
|
+
The path to prepend to the assets as configured in the webpack config 'publicPath'.
|
189
|
+
In the config example below its `publicPath: 'http://localhost:3025/assets'` so
|
190
|
+
client_asset_path should be set to the same.
|
191
|
+
|
192
|
+
For **production** use with readily precompiled and compressed assets which contain a fingerprint in the name (webpacks [chunkhash]),
|
193
|
+
and if the path in the manifest is the full path to the asset as configured in webpack,
|
194
|
+
these settings would work:
|
195
|
+
```ruby
|
196
|
+
OpalWebpackLoader.use_manifest = true
|
197
|
+
OpalWebpackLoader.manifest_path = File.join(Dir.getwd, 'public', 'assets', 'manifest.json')
|
198
|
+
OpalWebpackLoader.client_asset_path = ''
|
199
|
+
```
|
200
|
+
|
201
|
+
For **development** use with webpack-dev-server, with no manifest, these settings would work:
|
202
|
+
```ruby
|
203
|
+
OpalWebpackLoader.use_manifest = false
|
204
|
+
OpalWebpackLoader.manifest_path = File.join(Dir.getwd, 'public', 'assets', 'manifest.json') # doesn't matter, not used
|
205
|
+
OpalWebpackLoader.client_asset_path = 'http://localhost:3035/assets/'
|
206
|
+
```
|
207
|
+
### Advanced Options
|
208
|
+
[Advanced Options](https://github.com/isomorfeus/opal-webpack-loader/blob/master/docs/advanced_options.md)
|
209
|
+
### Tests
|
210
|
+
- clone the repo
|
211
|
+
- `bundle install`
|
212
|
+
- `bundle exec rspec`
|
@@ -1,7 +1,6 @@
|
|
1
1
|
#!/usr/bin/env ruby
|
2
2
|
require 'digest'
|
3
3
|
require 'oj'
|
4
|
-
require 'c_lexer'
|
5
4
|
require 'optparse'
|
6
5
|
require 'opal/paths'
|
7
6
|
require 'opal/source_map'
|
@@ -64,6 +63,10 @@ modules_to_require.each do |mod|
|
|
64
63
|
require mod
|
65
64
|
end
|
66
65
|
|
66
|
+
def compiler_options_digest(compiler_options)
|
67
|
+
@compiler_options_digest ||= Digest::SHA1.hexdigest(Oj.dump(compiler_options, mode: :strict))
|
68
|
+
end
|
69
|
+
|
67
70
|
def compile(request, cache, compiler_options)
|
68
71
|
begin
|
69
72
|
request_json = Oj.load(request.chop!, mode: :strict)
|
@@ -73,7 +76,7 @@ def compile(request, cache, compiler_options)
|
|
73
76
|
source = File.read(filename)
|
74
77
|
if cache
|
75
78
|
source_digest = Digest::SHA1.hexdigest(source)
|
76
|
-
key = "owl_#{compiler_options_digest}_#{source_digest}_#{compile_source_map}"
|
79
|
+
key = "owl_#{compiler_options_digest(compiler_options)}_#{source_digest}_#{compile_source_map}"
|
77
80
|
result_json = cache.get(key)
|
78
81
|
return result_json if result_json
|
79
82
|
end
|
@@ -95,6 +98,7 @@ end
|
|
95
98
|
if ARGV[0] == 'start'
|
96
99
|
number_of_instances = ARGV[1].to_i
|
97
100
|
number_of_instances == 4 if number_of_instances == 0
|
101
|
+
number_of_instances == 16 if number_of_instances > 16
|
98
102
|
else
|
99
103
|
raise 'arguments must be either "stop" or "start number_of_instances"'
|
100
104
|
exit(1)
|
@@ -112,8 +116,7 @@ begin
|
|
112
116
|
STDERR.puts "Exiting with drama."
|
113
117
|
exit(0)
|
114
118
|
else
|
115
|
-
|
116
|
-
result
|
119
|
+
compile(request, cache, compiler_options)
|
117
120
|
end
|
118
121
|
end
|
119
122
|
end.run
|