'Module parse failed: Unexpected token' issue on webpack-dev-server

[rafzielinski]

Hi 💀

TL:DR - I've got errors, don't want them

I'm starting a new project like this:

rails new myapp --webpack -d postgresql

Then adding to Gemfile:

gem 'activeadmin'
gem 'devise'

gem 'active_admin_slickr', git: 'https://github.com/primate-inc/active_admin_slickr.git', branch: 'master'
gem 'slickr_cms', git: 'https://github.com/primate-inc/slickr.git', branch: 'master_previewable'

Next in terminal:

bundle

rails g active_admin:install
rails g slickr:install # missing .babelrc file error

yarn install

rake db:create
rake db:migrate
rake db:seed

Except that .babelrc error all went well. FYI: it doesn't change anything if I set up Active Admin first or together with Slickr. _FYI2: I've also tried to change slickr_cms in package.json to 'masterpreviewable' branch, no luck

What's wrong:

I've got a bunch of errors on ./bin/webpack-dev-server

Few like this related to different files in same pkg:

ERROR in ./node_modules/slickr_cms/package/slickr/packs/slickr_text_area_editor.jsx 102:8
Module parse failed: Unexpected token (102:8)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
|
|       render(
>         <Provider store={store}>
|           <TextArea />
|         </Provider>,

I've tried to add .babelrc manually to the project, then I got this above previous errors:

ERROR in ./app/javascript/packs/application.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: .ignore must be an array, or undefined

error on: rails g slickr:install

/Library/Ruby/Gems/2.3.0/bundler/gems/slickr-c926e3f8be27/lib/generators/slickr/install_generator.rb:162:in `read': No such file or directory @ rb_sysopen - .babelrc (Errno::ENOENT)
    from /Library/Ruby/Gems/2.3.0/bundler/gems/slickr-c926e3f8be27/lib/generators/slickr/install_generator.rb:162:in `extend_babel_to_use_stage_1'

Any help appreciated 🙏

[rafzielinski]

There's some kind of conflict between versions of webpacker that's provided with rails new app --webpack (webpack 4) and one used in slickr (webpack 3).

A temporary solution to this can be to update gem version in Gemfile: gem 'webpacker', '~> 3.5'

and reinstall webpacker in a project bundle exec rails webpacker:install:react

ps. you might need to reinstall slickr as well.