maven实现对js文件进行变量替换和文件压缩

如果不存在变量替换问题,请跳转至该链接 https://blog.csdn.net/lianggeblog/article/details/100047723 进行快速配置。

需求:

发布线上正式版本时需要对js文件进行压缩,但项目中的js、html文件中有动态变量需要通过maven进行动态替换,核心配置如下

<!--指定变量替换文件所在位置-->
		<filters>
			<filter>src/main/resources/test.properties</filter>
		</filters>


<plugin>
				<groupId>org.apache.maven.plugins</groupId>
				<artifactId>maven-war-plugin</artifactId>
				<version>2.3</version>
				<configuration>
					<webResources>
						<resource>
							<directory>src/main/webapp</directory>
							<includes>
								<include>**/*.js</include>
								<include>**/*.html</include>
							</includes>
							<filtering>true</filtering>
						</resource>
					</webResources>
				</configuration>
			</plugin>


效果就是打war包之前将src/main/resources/test.properties文件中配置的变量在src/main/webapp的js和html文件中进行替换。

方案:

现在实现方式有两种:1.对js文件进行压缩,再对其进行变量替换。

              2.对js文件进行变量替换,再对其进行压缩。见篇幅二 https://blog.csdn.net/FU250/article/details/103195349

最终实现方式为第一种方式。

实现步骤如下:

1.首先使用压缩插件:com.samaxes.maven -- minify-maven-plugin,对 项目根目录/src/main/webapp下jslib下的所有js文件(如下:jslib/**/*.js),生成至 项目根目录/target/generated-sources 下。

 

<!--对静态资源js进行压缩-->
                    <plugin>
                        <groupId>com.samaxes.maven</groupId>
                        <artifactId>minify-maven-plugin</artifactId>
                        <version>1.7.6</version>
                        <executions>
                            <execution>
                                <id>wp-minify</id>
                                <configuration>
                                    <
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Maven本身并不提供对JS文件进行压缩的功能,但可以通过使用插件来实现。其中比较常用的是maven-minify-plugin和yuicompressor-maven-plugin两个插件。 maven-minify-plugin是一个通用的插件,支持对多种类型文件进行压缩,包括CSS、JS、HTML等。使用该插件需要在pom.xml中添加如下配置: ``` <build> <plugins> <plugin> <groupId>com.samaxes.maven</groupId> <artifactId>minify-maven-plugin</artifactId> <version>1.7</version> <executions> <execution> <id>minify-js</id> <phase>process-resources</phase> <goals> <goal>minify</goal> </goals> <configuration> <charset>UTF-8</charset> <jsSourceDir>${project.basedir}/src/main/webapp/js</jsSourceDir> <jsSourceFiles> <jsSourceFile>script1.js</jsSourceFile> <jsSourceFile>script2.js</jsSourceFile> </jsSourceFiles> <jsFinalFile>${project.build.directory}/minified/js/scripts-min.js</jsFinalFile> <jsEngine>CLOSURE</jsEngine> </configuration> </execution> </executions> </plugin> </plugins> </build> ``` 其中,`jsSourceDir`指定JS文件所在的目录,`jsSourceFiles`指定要压缩JS文件,`jsFinalFile`指定压缩后输出的文件路径,`jsEngine`指定使用的压缩引擎,可以选择CLOSURE、YUI等。 yuicompressor-maven-plugin是一个专门针对YUI压缩引擎的插件,使用该插件需要在pom.xml中添加如下配置: ``` <build> <plugins> <plugin> <groupId>net.alchim31.maven</groupId> <artifactId>yuicompressor-maven-plugin</artifactId> <version>1.5.1</version> <executions> <execution> <phase>process-resources</phase> <goals> <goal>compress</goal> </goals> </execution> </executions> <configuration> <nosuffix>true</nosuffix> <linebreakpos>10000</linebreakpos> <force>true</force> <excludes> <exclude>**/*.min.js</exclude> </excludes> <aggregations> <aggregation> <insertNewLine>true</insertNewLine> <output>${project.build.directory}/minified/js/scripts-min.js</output> <includes> <include>**/*.js</include> </includes> </aggregation> </aggregations> </configuration> </plugin> </plugins> </build> ``` 其中,`nosuffix`指定是否在文件名后添加.min后缀,`linebreakpos`指定行长度,`force`指定是否强制覆盖已存在的文件,`excludes`指定不压缩文件,`aggregations`指定需要压缩文件列表和输出路径。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值