Magento2：重新生成pub / static文件夹中的CSS文件

我已经安装了Magento 2并设置了开发人员模式，然后又安装了一个包含css和js文件的模块。该模块可以正常工作，并且从pub / static文件夹渲染css和js文件。现在，我已经在模块目录的css文件中更改了css并运行命令

php bin/magento setup:static-content:deploy

但Magento并未在pub / static CSS文件中进行新的更改，因此我得到的是旧的CSS文件内容。有谁知道如何在pub / static文件夹中重新生成整个CSS文件？

删除pub / static之前，请备份pub / static / .htaccess并再次还原。否则，您所有的CSS和JS都会显示404错误！

1. 删除pub/static[保留.htaccess备份并再次复制]
   2. 去掉 var/cache
   3. 去掉 var/composer_home
   4. 去掉 var/generation
   5. 去掉 var/page_cache
   6. 去掉 var/view_preprocessed
   7. 跑 php bin/magento setup:static-content:deploy

这里的答案不要提及您不应该删除 pub / static文件夹中的.htaccess。

删除除.htacces以外的所有文件，进入pub / static目录并运行

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

那你就可以跑

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

我刚刚从pub/static文件夹中删除了css文件，然后运行命令：

php bin/magento setup:static-content:deploy

它将重新生成具有最新更改的相同文件。

因为问题是在开发人员模式下js and css在Magento 2中进行更新。

1. 在您尊敬的模块中更新JS，在刷新页面之前，pub/static/frontend/namespace/theme/ ... module/js/...将其从删除的文件中删除，因此页面刷新后，会在pub文件夹中生成新的JS文件。
2. 在您关注的模块中更新CSS，请执行pt 1。
3. 更新较少的文件

在magento中设置主题 ...\dev\tools\grunt\configs\themes.js

将任何一个主题示例luma主题克隆到您的主题，并假定一个名称为xyz

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

在根文件夹中，将文件名：Gruntfile.js.sample更改为Gruntfile.js

在根文件夹中，将文件名：package.json.sample更改为package.json

需要在您的站点文件夹中咕gr咕 else，否则通过npm安装

具有管理员权限的打开命令提示符

grunt exec:theme部署主题后，第一次进入CMD中的站点文件夹并点击命令

然后grunt less:theme 每一次如果我们做更少的改变

如果您经常更改以减少使用量grunt watch，它将自动命中grunt less:theme

注意：您可能会收到Symlink错误，因此.../app/etc/di.xml在开发完成之前，请在本地文件中 注释掉或删除代码（在代码下方），直到开发完成为止，不要将此文件的经过修改的代码推送到服务器，仅在需要时才在本地使用。

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

简单方法1

在Magento管理员中。转到System > Tools > Cache Management并单击刷新静态文件缓存。

简单方法2

如果您只是更改了已经存在的css文件，则只需删除中的相应文件pub/static，然后在刷新页面时，它将生成新版本的css文件。它可以在开发人员模式下工作。

注意

1. 当您创建新文件而不是修改现有文件时，可能还需要清除缓存php bin/magento cache:flush。

2. 默认模式和开发人员模式不需要部署静态视图文件，因为静态文件是动态生成的，而不是具体实现的。（参考：关于Magento模式）

3. 在生产模式下，您可能还需要php bin/magento setup:static-content:deploy和php bin/magento cache:flush，但我还没有尝试生产模式。

好吧，根据我在其他各种文章中所读的内容以及我的个人经验，这里是重新生成CSS或任何静态内容的过程：

php bin/magento setup:upgrade

这将清除所有必需的缓存/生成/ etc文件，而不会删除您实际需要的任何内容。

php bin/magento setup:di:compile

然后将重新编译文件。最后：

php bin/magento setup:static-content:deploy

在执行最后一个命令后，所有内容应该都是全新的，只需刷新页面即可。

-----笔记------

1）在执行此操作之前，请确保正确设置了文件许可权和owner：user组，您可能需要与sysadmin讨论。

2）如果您的setup：upgrade命令失败，则可能会删除文件，并且由于我的文件权限而无法写入新文件。这可能会破坏您的站点，只是消除权限，然后重新运行命令。

3）到目前为止，我还没有找到一种方法来仅重新编译特定主题或文件（如果有人找到了一种方法，将非常有帮助），而无需编写完全自定义的脚本

如果有人知道更好的方法，请告诉我，因为12分钟的编译文件（因为我必须进行一些CSS更改）在我眼中是非常糟糕的设计。

-编辑-

Magento 2与Grunt绑定在一起，如果您花时间配置它，这将使刷新CSS / LESS文件变得更加轻松。大多数文件都以.sample文件的形式存在，只是删除.sample文件扩展名，在/ dev / tools / grunt / configs文件夹中配置themes.js文件。然后，当您需要刷新LESS文件时，您只需在命令行中运行grunt less：-theme--。

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

不要忘了运行grunt exec:theme，grunt less:theme命令在grunt的config文件夹theme中的themes.js文件中声明的主题（所有这些都在开发人员指南中），并且当magento处于开发人员模式时，您不应该运行static deploy命令，Magento2与...合作Symlinks

在您的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/

关于此问题，有一个重要说明需要注意，大多数答案并未具体指出。对于您的情况（使用正在使用的设置），将CSS重新生成到pub/static文件夹中时CSS更改没有被拾取的原因是您不会删除var/view_preprocessed目录的内容。在此目录中pub/static，您运行php bin/magento setup:static-content:deploy命令时会将CSS的缓存版本提取到该文件夹中。

因此，当您重新编译时，Magento将首先查找var/view_preprocessed用于缓存CSS 的文件夹。如果此文件夹为空，它将查找主题文件并拉出CSS进行编译。

这些设置是可配置的，因此有很多方法可以更改到达目的地的路线。但是对于您特定设置的解决方案：

1. 从文件pub/static夹中删除文件：rm -rf pub/static/*

2. 从文件var/view_preprocessed夹中删除文件：rm -rf var/view_preprocessed/*

3. 重新编译pub静态文件夹： php bin/magento setup:static-content:deploy

4. 清除缓存已打开： php bin/magento cache:clean

5. 刷新浏览器。

在pub / static / frontend
清除缓存中删除包含主题的文件夹。
您可以使用grunt观看应用样式表。在这里阅读

1. 删除pub static。
2. 授予pub/static777权限
3. 清除缓存。
4. 跑： php bin/magento setup:static-content:deploy

您将看到新的CSS。

注意：

授予适当的文件夹和文件权限。

我希望这能帮到您。

您不能只在管理面板中刷新静态缓存，然后

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

确保您使用的是开发人员模式。

然后执行以下代码：

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

刷新前端页面，这些步骤解决了我的问题。

但是，您可以在设置命令中添加-f或--force标志。

例：

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

我要把我的智慧滴落在这里。

我使用的cache_fly.shbash脚本基本上可以做到：

#!/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"

注意：我添加了回显，以显示我一生中浪费了多少时间等待它运行。这./magento也是php bin/magento在Docker容器中执行或调用相同操作的脚本，如果使用了docker，则可以创建或指向该脚本，php bin/magento但如果您正在阅读此书，则应该知道我在说什么，如果没有，请运行询问求助。

我的情况适应不大

#!/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"