IDEA中设置开发环境的热部署设置

比眉伴天荒 2022-12-24 13:00 114阅读 0赞

在web应用开发中，对界面进行调整后，不想总是频繁地重启应用，所以要设置一下热部置.

这里我们用的是IDEA开发工具.

1. 在Web模块的POM.xml中增加热部署组件引用和构建工程的插件配置.

<dependencies>
            <dependency>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-devtools</artifactId>
                <scope>runtime</scope>
                <optional>true</optional>  
            </dependency>
    </dependencies>
    
     <build>
            <plugins>
                <plugin>
                    <groupId>org.springframework.boot</groupId>
                    <artifactId>spring-boot-maven-plugin</artifactId>
                    <executions>
                        <execution>
                            <goals>
                                <goal>repackage</goal>
                            </goals>
                        </execution>
                    </executions>
                    
                    <configuration>
                        <fork>true</fork>
                    </configuration>
                </plugin>
            </plugins>
        </build>

2. 在IDEA中，通过组合键"shift+ctrl+alt+/",打开"Maintenance"对话框，选择"Registry".

![2020112815504644.png][]

3. 在打开的"Registry"中，选择"compiler.automake.allow.when.running"选项.

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3poYW5neWluZ2NoZW5ncWk_size_16_color_FFFFFF_t_70][]

4. 然后，对每个项目，在IDEA设置窗口"settings"中选择"compiler",勾选"Build project automatically".

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3poYW5neWluZ2NoZW5ncWk_size_16_color_FFFFFF_t_70 1][]

5. 可以打开浏览器的开发者工具窗口( 如chrome),选择"network"勾选"Disable cache".

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3poYW5neWluZ2NoZW5ncWk_size_16_color_FFFFFF_t_70 2][]

6.  另外，为了不让每次修改一个class就触发应用重启，在项目的配置文件"application.yml"中增加配置项:

#spring devtools 更改类程序文件不使用热部署自动重启
    spring.devtools.restart.enabled: false
    spring.devtools.livereload.enabled: false

7. 另外,项目的配置文件中还有两个重要的选项。

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3poYW5neWluZ2NoZW5ncWk_size_16_color_FFFFFF_t_70 3][]

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3poYW5neWluZ2NoZW5ncWk_size_16_color_FFFFFF_t_70 4][]

8. 下面测试以上配置的成果.

1） 修改页面的css文件后，保存，即可看到页面刷新了.

<!DOCTYPE html>
    <html lang="en">
    <head>
        <link rel="stylesheet" type="text/css" href="css/main.css">
        <link rel="stylesheet" type="text/css" href="css/index.css">
        <meta charset="UTF-8">
        <title>图片展示</title>
    </head>
    <body>
    <p>hello world</p>
    </body>
    </html>

p {
        color: red;
    }

![20201128160328407.png][]

2. )修改页面上的html也可以立即更新页面了.

[2020112815504644.png]: /images/20221120/a28656d97aee41b980030af2563ea2f9.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3poYW5neWluZ2NoZW5ncWk_size_16_color_FFFFFF_t_70]: /images/20221120/f313053d0a174207abf086f926b88e5a.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3poYW5neWluZ2NoZW5ncWk_size_16_color_FFFFFF_t_70 1]: https://img-blog.csdnimg.cn/2020112815553974.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3poYW5neWluZ2NoZW5ncWk=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3poYW5neWluZ2NoZW5ncWk_size_16_color_FFFFFF_t_70 2]: https://img-blog.csdnimg.cn/20201128155804958.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3poYW5neWluZ2NoZW5ncWk=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3poYW5neWluZ2NoZW5ncWk_size_16_color_FFFFFF_t_70 3]: https://img-blog.csdnimg.cn/2020120117125430.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3poYW5neWluZ2NoZW5ncWk=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3poYW5neWluZ2NoZW5ncWk_size_16_color_FFFFFF_t_70 4]: https://img-blog.csdnimg.cn/20201201171309733.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3poYW5neWluZ2NoZW5ncWk=,size_16,color_FFFFFF,t_70
[20201128160328407.png]: https://img-blog.csdnimg.cn/20201128160328407.png