• Jobs
  • About Us
  • professionals
    • Home
    • Jobs
    • Courses and challenges
  • business
    • Home
    • Post vacancy
    • Our process
    • Pricing
    • Assessments
    • Payroll
    • Blog
    • Sales
    • Salary Calculator

0

218
Views
No se puede crear un proyecto de aplicación de reacción con PUBLIC_URL personalizado

Lo estoy intentando

 PUBLIC_URL=http://example.com npm run build

con un proyecto creado con el último script create-react-script.

Sin embargo, las apariciones de %PUBLIC_URL% en public/index.html se reemplazan con una cadena vacía, no el valor esperado PUBLIC_URL .

public/index.html contiene código como

 <script src="%PUBLIC_URL%/static/js/jarvis.widget.min.js"></script>

Horas de búsqueda en Internet y el desbordamiento de la pila muestran que se escribe muy poco sobre PUBLIC_URL . Cloné create-react-app de GitHub y he estado navegando por el código, pero aún no me han aclarado.

¿Alguien tiene alguna sugerencia sobre lo que estoy haciendo mal?

about 3 years ago · Santiago Trujillo
3 answers
Answer question

0

Si las otras respuestas no le funcionan, también hay un campo de homepage de inicio en package.json . Después de ejecutar npm run build , debería recibir un mensaje como el siguiente:

 The project was built assuming it is hosted at the server root. To override this, specify the homepage in your package.json. For example, add this to build it for GitHub Pages: "homepage" : "http://myname.github.io/myapp",

Simplemente lo agregaría como uno de los campos raíz en package.json , por ejemplo

 { // ... "scripts": { // ... }, "homepage": "https://example.com" }

Cuando se configura correctamente, ya sea a través de la homepage de inicio o PUBLIC_URL , debería recibir un mensaje como este:

 The project was built assuming it is hosted at https://example.com. You can control this with the homepage field in your package.json.
about 3 years ago · Santiago Trujillo Report

0

Gente como yo que está buscando algo como esto en la compilación:

 <script type="text/javascript" src="https://dsomething.cloudfront.net/static/js/main.ec7f8972.js">

Luego, configurar https://dsomething.cloudfront.net como página de homepage en package.json no funcionará.

1. Solución rápida

Construye tu proyecto así:
(ventanas)

 set PUBLIC_URL=https://dsomething.cloudfront.net&&npm run build

(linux/mac)

 PUBLIC_URL=https://dsomething.cloudfront.net npm run build

y obtendrás

 <script type="text/javascript" src="https://dsomething.cloudfront.net/static/js/main.ec7f8972.js">

en su index.html construido

2. Solución permanente y recomendada

Cree un archivo llamado .env en la raíz de su proyecto (mismo lugar donde se encuentra el paquete.json).
En este archivo, escriba esto (sin comillas alrededor de la URL):

 PUBLIC_URL=https://dsomething.cloudfront.net

Cree su proyecto como de costumbre ( npm run build )
Esto también generará index.html con:

 <script type="text/javascript" src="https://dsomething.cloudfront.net/static/js/main.ec7f8972.js">

3. Solución extraña (no funcionará en la última versión de react-scripts)

Agregue esto en su paquete.json
"página de inicio": "http://dsomething.cloudfront.net",

Entonces se generará index.html con:

 <script type="text/javascript" src="//dsomething.cloudfront.net/static/js/main.ec7f8972.js">

Que es básicamente lo mismo que:

 <script type="text/javascript" src="https://dsomething.cloudfront.net/static/js/main.ec7f8972.js">

en mi entendimiento.

Problema de Github Comentario de Github

about 3 years ago · Santiago Trujillo Report

0

No es así como se usa la variable PUBLIC_URL. De acuerdo con la documentación , puede usar PUBLIC_URL en su HTML:

<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">

O en tu JavaScript:

 render() { // Note: this is an escape hatch and should be used sparingly! // Normally we recommend using `import` for getting asset URLs // as described in “Adding Images and Fonts” above this section. return <img src={process.env.PUBLIC_URL + '/img/logo.png'} />; }

PUBLIC_URL no es algo que establezca en un valor de su elección, es una forma de almacenar archivos en su implementación fuera del sistema de compilación de Webpack.

Para ver esto, ejecute su aplicación CRA y agréguelo al archivo src/index.js :

console.log('public url: ', process.env.PUBLIC_URL)

Verás que la URL ya existe.

Lea más en los documentos de CRA .

about 3 years ago · Santiago Trujillo Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Our process Sales
Legal
Terms and conditions Privacy policy
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recommend me some offers
I have an error