Magento2: Re generar archivos CSS en la carpeta pub / static

Instalé Magento 2 y configuré el modo desarrollador, luego instalé un módulo que contiene archivos css y js. El módulo funciona bien y los archivos css y js se procesan desde la carpeta pub / static. Ahora he realizado cambios en CSS en el directorio de módulos del archivo CSS y ejecuto el comando

php bin/magento setup:static-content:deploy

pero Magento no está haciendo mis nuevos cambios en los archivos pub / static css, así que obtengo el contenido del archivo css antiguo. ¿Alguien sabe cómo regenerar todo el archivo css en la carpeta pub / static?

Antes de eliminar pub / static haga una copia de seguridad de pub / static / .htaccess y restaure nuevamente. de lo contrario, todos sus css y js mostrarán un error 404.

1. Eliminar pub/static[Mantenga copia de seguridad del .htaccess y cópielo de nuevo]
   2. Eliminar var/cache
   3. Eliminar var/composer_home
   4. Eliminar var/generation
   5. Eliminar var/page_cache
   6. Eliminar var/view_preprocessed
   7. correr php bin/magento setup:static-content:deploy

Las respuestas aquí no mencionan que no debe eliminar .htaccess en la carpeta pub / static.

para eliminar todos los archivos excepto los .htacces ingrese al directorio pub / static y ejecute

find . -depth -name .htaccess -prune -o -delete

entonces puedes correr

rm -rf var/cache/ var/generation/ var/page_cache/ var/view_preprocessed/ 

Acabo de eliminar los archivos CSS de la pub/staticcarpeta y ejecuto el comando:

php bin/magento setup:static-content:deploy

Regenerará el mismo archivo con los últimos cambios.

Como la pregunta es para js and cssactualizar en Magento 2 en modo desarrollador .

1. Actualizando el JS en su módulo respetado, antes de actualizar la página, el mismo archivo se pub/static/frontend/namespace/theme/ ... module/js/...eliminará, por lo que después de actualizar la página, se generará un nuevo archivo JS en la carpeta pub.
2. Actualizando el CSS en su respetado módulo, haga el pt 1.
3. Actualizando menos archivo

Configurar tema en magento ...\dev\tools\grunt\configs\themes.js

Clone cualquier tema de ejemplo, tema de luma a su tema y asigne un nombre, suponga xyz

xyz: {
        area: 'frontend',
        name: 'Magento/luma',
        locale: 'en_US',
        files: [
            'css/styles-m',
            'css/styles-l'
        ],
        dsl: 'less'
    }

En la carpeta raíz, cambie el nombre del archivo: Gruntfile.js.sample a Gruntfile.js

En la carpeta raíz, cambie el nombre del archivo: package.json.sample a package.json

Necesita tener gruñido en la carpeta de su sitio o instalar a través de npm

Abrir símbolo del sistema con permiso de administrador

Vaya a la carpeta del sitio en CMD y presione el comando grunt exec:themepor primera vez después de implementar el tema

Entonces grunt less:theme cada vez que hagamos algún cambio en menos

Si está haciendo cambios frecuentes en menos uso, grunt watchpor lo tanto, golpeará automáticamentegrunt less:theme

Nota: es posible que obtenga un error de enlace simbólico, así que vaya al archivo .../app/etc/di.xmly comente o elimine el código (código debajo) en su local hasta que se complete el desarrollo, no envíe el código modificado de este archivo al servidor, solo se requiere en local si es necesario.

<item name="view_preprocessed" xsi:type="object">Magento\Framework\App\View\Asset\MaterializationStrategy\Symlink</item>

Manera simple 1

En el administrador de Magento. Vaya System > Tools > Cache Managementy haga clic en Vaciar caché de archivos estáticos .

Manera simple 2

Si acaba de cambiar el archivo CSS que ya existente , lo que hay que hacer es simplemente borrar el archivo correspondiente pub/staticy, a continuación, al actualizar la página, que va a generar la nueva versión del archivo CSS. Funciona en modo desarrollador .

Aviso

1. Al crear nuevo archivo, en lugar de modificar un archivo existente, es posible que tenga que borrar la caché, php bin/magento cache:flush.

2. El modo predeterminado y el modo desarrollador no necesitan implementar archivos de vista estáticos , debido a que los archivos estáticos se generan dinámicamente en lugar de materializarse. (Referencia: sobre los modos Magento )

3. En el modo de producción , es posible que también necesite php bin/magento setup:static-content:deployy php bin/magento cache:flush, aún no pruebo el modo de producción .

De acuerdo con lo que he leído en otras publicaciones y mi experiencia personal aquí es el proceso para regenerar el CSS o cualquier contenido estático:

php bin/magento setup:upgrade

Esto eliminará todos los archivos de caché / generación / etc. necesarios sin eliminar todo lo que realmente necesita.

php bin/magento setup:di:compile

Esto volverá a compilar los archivos. Finalmente:

php bin/magento setup:static-content:deploy

Después del último comando, todo debería ser nuevo y fresco, simplemente actualice su página.

----- Notas ------

1) Asegúrese de que sus permisos de archivo y propietario: el grupo de usuarios esté configurado correctamente antes de hacer esto, es posible que deba hablar sobre esto con su administrador de sistemas.

2) Si su configuración: el comando de actualización falla, podría eliminar los archivos y no poder escribir los nuevos, como fue mi caso debido a los permisos de archivo. Esto puede romper su sitio, simplemente elimine los permisos y luego vuelva a ejecutar el comando.

3) No he encontrado (hasta ahora) una forma de volver a compilar solo un tema o archivo específico (sería muy útil si alguien encuentra una manera) sin escribir un script completamente personalizado

Si alguien sabe de algo mejor, hágamelo saber, porque 12 minutos de compilación de archivos porque tuve que hacer algunos cambios de CSS es un diseño extremadamente pobre en mis ojos.

--- Editar ---

Magento 2 tiene a Grunt vinculado y esto hace que la actualización de archivos CSS / LESS sea infinitamente más fácil si se toma el tiempo para configurarlo. La mayoría de los archivos están allí como archivos .sample simplemente elimine la extensión de archivo .sample, configure el archivo themes.js en la carpeta / dev / tools / grunt / configs. Luego, cuando necesite actualizar sus MENOS archivos, simplemente ejecute gruñido menos: - tema-- desde la línea de comandos.

Recurso: http://devdocs.magento.com/guides/v2.0/frontend-dev-guide/css-topics/css_debug.html

no olvide ejecutar los comandos grunt exec:theme, grunt less:themedonde themeestá el tema que declaró en el themes.jsarchivo desde la carpeta de configuración de grunt (todo esto está en la guía del desarrollador) y cuando tiene magento en modo desarrollador no debe ejecutar el comando de implementación estática, Magento2funciona conSymlinks

Ejecute estos comandos en su carpeta raíz de Magento :

alias mage="php -d memory_limit=-1 -f bin/magento"

chmod -R 775 pub/static/ var/ pub/media/ &&
rm -rf var/view_preprocessed/ var/cache/ var/page_cache/ var/tmp/ var/generation/ pub/static/frontend/ ;
mage cache:flush &
mage indexer:reindex &
mage setup:upgrade &&
mage setup:static-content:deploy ; 
mage setup:db-data:upgrade &&
mage dev:source-theme:deploy &&
chmod -R 775 pub/static/ pub/media/ var/

Hay una nota importante que hacer sobre esta pregunta que la mayoría de las respuestas no señalan específicamente. En su caso (con la configuración que está utilizando), la razón por la que sus cambios de CSS no se recogen cuando regenera el CSS en la pub/staticcarpeta es que no está eliminando el contenido del var/view_preprocesseddirector. Dentro de este directorio hay una versión en caché de su CSS que está ingresando a la pub/staticcarpeta cuando ejecuta el php bin/magento setup:static-content:deploycomando.

Entonces, cuando recompila, Magento primero buscará en la var/view_preprocessedcarpeta el CSS en caché. Si esta carpeta está vacía, buscará los archivos de tema y extraerá ese CSS para su compilación.

Estos ajustes son configurables, por lo que hay muchas maneras de llegar a su destino que cambiarán el camino que debe seguir. Pero para la solución a su configuración específica:

1. Eliminar los archivos de la pub/staticcarpeta:rm -rf pub/static/*

2. Eliminar los archivos de la var/view_preprocessedcarpeta:rm -rf var/view_preprocessed/*

3. Vuelva a compilar la carpeta estática de pub: php bin/magento setup:static-content:deploy

4. Borrar caché está encendido: php bin/magento cache:clean

5. Actualiza el navegador.

Elimine la carpeta que contiene su tema en el
caché claro pub / static / frontend
Puede usar gruñido para ver aplicar hojas de estilo. Leer aquí

1. Eliminar pub estático.
2. Dar pub/staticpermiso 777
3. Limpiar cache.
4. Correr: php bin/magento setup:static-content:deploy

Verás nuevo CSS.

NOTA:

Dé la carpeta y el permiso de archivo adecuados.

Espero que esto ayude.

¿No podría simplemente vaciar la caché estática en el panel de administración y luego

run php bin/magento setup:static-content:deploy

Asegúrate de estar usando el modo desarrollador.

Luego ejecute el siguiente código:

chmod -R 777 var generated pub/static
grunt exec:default
grunt less:your_theme_name

Actualice la página frontend. Estos pasos resolvieron mi problema.

Sin embargo, puede agregar el indicador -fo --forceal comando de configuración.

Ejemplo:

php bin/magento setup:static-content:deploy -f

Voy a dejar caer mi gota de sabiduría aquí.

Yo uso un cache_fly.shscript bash que básicamente hace:

#!/bin/bash
start=`date +%s%N`
./magento setup:upgrade && \ 
./magento cache:flush && \ 
./magento setup:static-content:deploy -f
end=`date +%s%N`
runtime=$(bc <<< "scale=9;($end-$start)/1000000000")
echo "" && echo "" && echo -e "\e[34mTOTAL EXECUTION TIME: \e[1m\e[93m$runtime\e[0m"

NOTA: He agregado un eco para mostrarme cuántas veces de mi vida he perdido esperando que se ejecute. También ./magentohay una secuencia de comandos para hacer php bin/magentoo llamar a la misma cosa dentro del contenedor de la ventana acoplable, si se usa la ventana acoplable, puede hacer la suya o señalarla, php bin/magentopero si está leyendo esto, debe saber de qué estoy hablando, si no, ejecute la pregunta por ayuda

Poca adaptación para mi caso

#!/bin/bash
start=`date +%s%N`
chmod -R 775 pub/static/ var/ pub/media/ && \
rm -rf var/view_preprocessed/* var/cache/* var/page_cache/* var/tmp/* var/generation/* pub/static/frontend/* && \
./magento cache:flush && \
./magento setup:upgrade && \
./magento cache:clean && \
./magento s:s:d es_ES en_US -f && \
./magento setup:di:compile && \
chmod -R 775 pub/static/ pub/media/ var/
end=`date +%s%N
runtime=$(bc <<< "scale=9;($end-$start)/1000000000")
echo "" && echo "" && echo -e "\e[34mTOTAL EXECUTION TIME: \e[1m\e[93m$runtime\e[0m"