Request: Webpack

+1, también viendo esto

Producción:

ERROR in ./~/request/lib/har.js
Module not found: Error: Cannot resolve module 'fs' in /absolute/path/to/project/node_modules/request/lib
 @ ./~/request/lib/har.js 3:9-22

ERROR in ./~/request/~/tunnel-agent/index.js
Module not found: Error: Cannot resolve module 'net' in /absolute/path/to/project/node_modules/request/node_modules/tunnel-agent
 @ ./~/request/~/tunnel-agent/index.js 3:10-24

ERROR in ./~/request/~/tunnel-agent/index.js
Module not found: Error: Cannot resolve module 'tls' in /absolute/path/to/project/node_modules/request/node_modules/tunnel-agent
 @ ./~/request/~/tunnel-agent/index.js 4:10-24

ERROR in ./~/request/~/forever-agent/index.js
Module not found: Error: Cannot resolve module 'net' in /absolute/path/to/project/node_modules/request/node_modules/forever-agent
 @ ./~/request/~/forever-agent/index.js 6:10-24

ERROR in ./~/request/~/forever-agent/index.js
Module not found: Error: Cannot resolve module 'tls' in /absolute/path/to/project/node_modules/request/node_modules/forever-agent
 @ ./~/request/~/forever-agent/index.js 7:10-24

ERROR in ./~/request/~/tough-cookie/lib/cookie.js
Module not found: Error: Cannot resolve module 'net' in /absolute/path/to/project/node_modules/request/node_modules/tough-cookie/lib
 @ ./~/request/~/tough-cookie/lib/cookie.js 23:10-24

ERROR in ./~/request/~/form-data/lib/form_data.js
Module not found: Error: Cannot resolve module 'fs' in /absolute/path/to/project/node_modules/request/node_modules/form-data/lib
 @ ./~/request/~/form-data/lib/form_data.js 7:9-22

ERROR in ./~/request/~/har-validator/~/is-my-json-valid/~/jsonpointer/jsonpointer.js
Module not found: Error: Cannot resolve module 'console' in /absolute/path/to/project/node_modules/request/node_modules/har-validator/node_modules/is-my-json-valid/node_modules/jsonpointer
 @ ./~/request/~/har-validator/~/is-my-json-valid/~/jsonpointer/jsonpointer.js 1:14-32

Me lo imaginé. El problema es que Webpack requiere una configuración adicional a diferencia de browserify debido a su naturaleza más básica. Vea mi rama de ejemplo y la diferencia para ver cómo logré que las pruebas se ejecuten correctamente.

https://github.com/request/request/compare/master...pho3nixf1re : webpack-tests

Mi plan es convertir eso en su propia prueba de karma y enviar un PR para que otros puedan usarlo como ejemplo. Además, puede descubrir problemas futuros a medida que avanza el desarrollo.

Sí, encontré lo mismo, gracias. Para cualquier otra persona que se encuentre con esto, los documentos relevantes del paquete web están aquí: http://webpack.github.io/docs/configuration.html#node

@jaredmcdonald muchas gracias :)

@ pho3nixf1re sería genial si envía un PR sobre la solicitud de prueba con el paquete web (prueba adicional, no en lugar de la de browserify): +1:

¡Sí! Pretendo. Solo lo reemplacé en mi sucursal como una prueba rápida de concepto. Me ocuparé de eso este fin de semana.

Lamentablemente, agregar el cargador de paquetes web json no solucionó este problema.

El mismo problema aquí.

La solución: instale json-loader para que el paquete web pueda manejar archivos * .json. Luego agregue ese cargador y un nuevo objeto node a su webpack.config.js así:

$ npm install --save-dev json-loader

webpack.config.js

var path = require('path');

module.exports = {
  entry: 'index',
  output: {
    path: path.join(__dirname, 'scripts'),
    filename: 'bundle.js'
  },
  module: {
    loaders: [
      { test: /\.json$/, loader: 'json-loader' }
    ]
  },
  resolve: {
    extensions: ['', '.webpack.js', '.web.js', '.js']
  },
  node: {
    console: 'empty',
    fs: 'empty',
    net: 'empty',
    tls: 'empty'
  }
};

Agregar el objeto node: { ... } evita el error, pero luego no puedo usar console en el navegador. ¿Hay alguna forma de evitar esto?

Me lo imaginé:

node: {
    console: true
}

Esto fue de gran ayuda para mí. Gracias a todos los anteriores.

Gracias a todos, me encontré con esto yo mismo.

¿alguna suerte?

Estoy usando webpack & request y obtuve el error que todos tienen aquí.
Probé la solución con el elemento json-loader & node y sigo recibiendo los errores ...

Hola. Necesito ayuda. Quiero combinar el nodo js mysql en mi aplicación de reacción. Pero recibí un mensaje de error: no puedo resolver el módulo 'net' cuando ejecuto el paquete web.
Consulte los códigos a continuación:

import React from 'react'
import ReactDOM from 'react-dom'
import mysql from 'mysql'

export default class Server extends React.Component{
render(){
return(
<div>
<div>Success Inserting New Data</div>
<div>Company Name: {this.props.name}</div>
<div>Email: {this.props.email}</div>
</div>
);
}
}

var company_data = {
name: 'Company Name Sample',
email: '[email protected]'
};

let connection = mysql.createConnection({
host: 'localhost',
user: 'root',
password: '',
database: 'earnmoredoless'
});

connection.connect();

let sql = connection.query('insert into account set ?', data, function(err, res){

`//success`
`if(!err){`

    `ReactDOM.render(`
        `<Server data={company_data} />,`
        `document.querySelector('#app')`
    `);`

`}else{`

    `console.log('Failed inserting new data.');`
`}`

});

+1
esto me salvó

+1
¡Salvado!

+1 Tuve problemas con dotenv yo mismo. La solución anterior resolvió mi problema. ¡Gracias!

Agregar el nodo { fs: 'empty' } resolvió el problema cannot resolve module 'fs' para mí, pero ahora mi consola tiene un error TypeError: fs.readFileSync is not a function . Me encuentro con este problema al intentar usar dotev y webpack con es6 babel transpiler. Importar paquete web como import 'dotenv/config'; como se describe en https://github.com/motdotla/dotenv/issues/114

Si bien la solución de node {} anterior ayudó a mi webpack.config.js, rompió mi karma.conf.js, que depende de él, con el siguiente error:

ReferenceError: el modo estricto prohíbe la creación implícita de la propiedad global '_crypto'

¿Alguien resolvió esto para que funcione con dotenv ?

Tengo este problema al intentar usar node-soap , que depende de request en una aplicación React que usa paquete web. Intenté modificar la configuración de mi paquete web para contener;

node: {
    console: true,
    fs: 'empty',
    net: 'empty',
    tls: 'empty'
  }

Como se sugirió anteriormente, pero eso no resolvió el problema para mí. Sigo viendo estos errores;

Otros están viendo los mismos problemas;
https://gitter.im/vpulim/node-soap/archives/2016/04/13
https://gitter.im/vpulim/node-soap/archives/2016/01/11

Y hasta donde yo sé, nadie tiene una solución todavía. No estoy muy familiarizado con el paquete web, pero si nadie más tiene una solución todavía, puedo tratar de afeitarme ese yak este fin de semana si tengo tiempo para poder depurar esto más.

@kevhuang @sailingthoms @MrOutis o @gaearon ¿ node-soap / request trabaje con React? (Preferiblemente con create-react-app sin tener que expulsar).

@screendriver ¿ sacaste la información sobre el _objeto de nodo_? No lo veo en la documentación.

@richburdon , @lucasbento ¿Tiene un ejemplo para ayudarle?

@garethderioth lo siento, no puedo recordar. Ha pasado mucho tiempo.

Por cierto: mientras tanto, estoy usando la API de recuperación de HTML5 y este polyfill para mis solicitudes AJAX.

@garethderioth
@jaredmcdonald lo dijo arriba en https://github.com/request/request/issues/1529#issuecomment -90347445

Sí, encontré lo mismo, gracias. Para cualquier otra persona que se encuentre con esto, los documentos relevantes del paquete web están aquí: http://webpack.github.io/docs/configuration.html#node

Por cierto: mientras tanto, estoy usando la API de recuperación de HTML5 y este polyfill para mis solicitudes AJAX.

Crear usuarios de la aplicación React: tenga en cuenta que CRA ya incluye un polyfill window.fetch para que pueda usarlo de manera segura en lugar de request si satisface su caso de uso.

@screendriver @josiahsprague En lugar de esto:

node: {
    console: true,
    fs: 'empty',
    net: 'empty',
    tls: 'empty'
}

Escribí:

target: 'node',

Resolvió todos mis problemas.

Editar: puede leer más sobre esto aquí: https://webpack.github.io/docs/configuration.html#target

@gaearon ¿
Planteando un problema en el repositorio de create-react-app, como debería haberlo hecho desde el principio: /

Mi captura de pantalla de errores publicada anteriormente es irrelevante, lo que probablemente sea obvio para cualquiera que lea esos errores. 😂 De todos modos, parece que ambas soluciones en el comentario de @pedzed funcionarían para mí. Otra posible solución es usar target: 'node-webkit u otra opción similar dependiendo de su situación.

En mi caso, acabo de cambiar de node-soap a browser-soap , pero eso no funcionará para todos.

Tuve un problema diferente que es similar a este, pero terminé siendo socketio / socket.io-client / issues / 933 para cualquiera que pueda experimentarlo

+1
¡Gracias!

Hice un pequeño cambio usando lo que @screendriver & @kilometers proporcionaron (¡gracias!).

Webpack se quejó si había una extensión vacía, sin embargo, no creo que esto sea necesario para la mayoría.

`` ``
var ruta = require ('ruta')
var request = require ('solicitud')
var webpack = require ('paquete web')

module.exports = {
entrada: './src/main.js',
producción: {
ruta: ruta.resolve (__ dirname, './dist'),
publicPath: '/ dist /',
nombre de archivo: 'build.js'
},
módulo: {
reglas: [
{
prueba: /.json$/,
cargador: 'json-loader'
}
]
},
resolver: {
/ extensions: ['.webpack.js', '.web.js', '.js'] /
}
nodo: {
consola: cierto,
fs: 'vacío',
net: 'vacío',
tls: 'vacío'
}
}
`` ``

La mejor solución sencilla sin afectar el código incluido:

Para aquellos que tienen problemas con el libro de cuentos y no quieren reemplazar la configuración del paquete web original del libro de cuentos, pueden extenderlo creando .storybook/webpack.config.js y agregar:

// Load the default config generator.
const genDefaultConfig = require('@kadira/storybook/dist/server/config/defaults/webpack.config.js');

module.exports = function (config, env) {
    const newConfig = genDefaultConfig(config, env);

    // Extend to resolve fs issues
    newConfig.node = {
        fs: 'empty'
    };

    return newConfig;
};

  node: {
    console: true,
    fs: 'empty',
    net: 'empty',
    tls: 'empty'
  }

El uso de este error de código anterior se ha resuelto pero

fs.writeFile('/home/react-hello-world/test.txt', 'aaa', function(err) { alert(err); });

fs.writeFile no funciona, proporcione una solución.

@chandrasekarb intente establecer fs en verdadero en lugar de 'vacío'

target: 'node', funcionó para mí: department_store:

Me encontré con este problema y fue porque estaba ejecutando una configuración dual de cliente / servidor para la representación del lado del servidor. La configuración de representación del lado del servidor se marcó como destino: 'nodo', mientras que la configuración del cliente no tenía una especificada. Agregué target: 'web' a la configuración del cliente y el error desapareció.

Este problema se ha marcado automáticamente como obsoleto porque no ha tenido actividad reciente. Se cerrará si no se produce más actividad. Gracias por sus aportaciones.

La solicitud está ahora en modo de mantenimiento y no fusionará ninguna función nueva ni solucionará este error. Consulte el número 3142 para obtener más información.

Tuve el mismo problema al tratar de usar jQuery con Nuxt (o Nodo), el problema era que estaba importando jQuery y Bootstrap y agregué jsdom para resolverlo pero no funcionó. Lo resolví importando bibliotecas directamente en la sección head de nuxt.config.js , otra forma es configurar client mode en los complementos de configuración de nuxt, espero que ayude a alguien.