Webpack.config.js не загружается в новое приложение rails 6 - PullRequest
0 голосов
/ 11 июня 2019

Я настроил новое приложение Rails 6 для работы с tailwindcss, и я впервые испытал правильное использование webpack.Я пытаюсь использовать jquery и хочу убедиться, что любая ссылка на $ или jquery в моих сценариях поддерживается должным образом

Я следовал инструкциям для установки пакета jquery-ui, которыйпотребовал, чтобы я создал файл webpack.config.js, но, похоже, он не будет работать, пока я не определю теги jquery в application.js.

Хотя это временно решает мою проблему, я хочу убедиться, что webpack.config.js правильно настроен для будущего использования.

webpack.config.js

const path = require('path');
const webpack = require('webpack');
module.exports = {
  entry: {
    index:'./src/index.js'
  },
  output: {
    filename: 'bundled.js',
    path: path.resolve(__dirname, 'dist'),
    publicPath:'dist/'
  },
  module: {
    rules: [
      {
        test: /\.css$/,
        loaders: ["style-loader","css-loader"]
      },
      {
        test: /\.(jpe?g|png|gif)$/i,
        loader:"file-loader",
        options:{
          name:'[name].[ext]',
          outputPath:'assets/images/'
          //the images will be emited to dist/assets/images/ folder
        }
      }
    ]
  },
  plugins: [
    /* Use the ProvidePlugin constructor to inject jquery implicit globals */
    new webpack.ProvidePlugin({
        $: "jquery",
        jQuery: "jquery",
        "window.jQuery": "jquery'",
        "window.$": "jquery"
    })
  ]
};

application.js

require("@rails/ujs").start()
require("turbolinks").start()
require("@rails/activestorage").start()
require("channels")

require('webpack-jquery-ui');

import $ from 'jquery';
window.jQuery = $;
window.$ = $;

package.json

{
  "name": "www",
  "private": true,
  "dependencies": {
    "@rails/actioncable": "^6.0.0-alpha",
    "@rails/activestorage": "^6.0.0-alpha",
    "@rails/ujs": "^6.0.0-alpha",
    "@rails/webpacker": "^4.0.7",
    "webpack-jquery-ui": "^2.0.1",
    "tailwindcss": "^1.0.3",
    "turbolinks": "^5.2.0"
  },
  "version": "0.1.0",
  "devDependencies": {
    "webpack-dev-server": "^3.7.0"
  }
}
...