Как импортировать файл React (jsx) в приложение Rails? - PullRequest
Новая
       2

Как импортировать файл React (jsx) в приложение Rails?

0 голосов
/ 29 мая 2019

У меня проблема при запуске . / Bin / webpack-dev-server в моем приложении Rails. Я получаю сообщение об ошибке: 

Failed to compile.

./app/javascript/packs/blob.js
Module build failed: SyntaxError: Unexpected token (5:1)

  3 | 
  4 | 
> 5 | <!DOCTYPE html>
    |  ^

Я не уверен, чтоно я думаю, что-то должно быть добавлено в webpack.config.js

1 Ответ

2 голосов
/ 29 мая 2019

Ваша конфигурация веб-пакета может быть неправильной, он пытается скомпилировать JavaScript из html-файла, вам нужно указать jsx-файл записи в вашей конфигурации веб-пакета.Я обычно помещаю все свои файлы jsx в папку frontend в корневом каталоге проекта и использую следующий файл webpack.config.js в корневом каталоге 

const path = require('path');

module.exports = {
  context: __dirname,
  entry: './frontend/ROOT FILE NAME.jsx',
  output: {
    path: path.resolve(__dirname, 'app', 'assets', 'javascripts'),
    filename: 'bundle.      },
  module: {
    rules: [{
      test: /\.jsx?$/,
      exclude: /(node_modules)/,
      use: {
        loader: 'babel-loader',
        query: {
          presets: ['@babel/env', '@babel/react',],
          plugins: ['@babel/plugin-proposal-class-properties']
        }
      },
    }]
  },
  devtool: 'source-map',
  resolve: {
    extensions: [".js", ".jsx"]
  }
};

Обратите внимание, что у меня есть Babel с некоторыми добавленными расширениями, вы можете захотетьдобавить или удалить несколько в зависимости от используемого вами синтаксиса JS.

См. здесь о том, как настроить корневой файл

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...