评论

收藏

[JavaScript] #私藏项目实操分享# 使用脚本进行 SAP Spartacus 安装工作

开发技术 开发技术 发布于:2021-12-05 20:16 | 阅读数:663 | 评论:0

Test the Spartacus installation with schematics on Windows
本文介绍详细步骤。
首先使用命令行安装 verdaccio:
Install verdaccio $ npm i -g verdaccio@4 (only for the first time)
Verdaccio 是一个简单的、零配置要求的本地私有 NPM 注册表。 不需要整个数据库就可以开始。 Verdaccio 开箱即用,带有自己的小型数据库,并且能够代理其他注册表(例如 npmjs.org),还引入了缓存下载模块的功能。 对于那些希望扩展其存储能力的人,Verdaccio 支持各种社区制作的插件来连接到服务,例如 Amazon 的 S3、Google Cloud Storage 或创建自己的插件。
DSC0000.png
使用下面的命令行添加新用户:

npm adduser --registry http://localhost:4873
DSC0001.png
这样,之后安装 Spartacus 需要拖取依赖包时,可以从本地 verdaccio 数据库里读取内容,而无需通过网络读取。
错误1:lsof command not found
DSC0002.png
lsof 命令用来检查 verdaccio 是否已经正在运行了:

DSC0003.png
verdaccio 用来注册新用户,完成之后需要结束该进程。

上面脚本的含义是,把 lsof 命令的结果存到变量 VERDACCIO_PID 里,然后检查该变量是否不为空。
-n 操作检测后面的操作数是否为空。
if [ ! -n "$1" ] 的含义是,检查第一个参数是否为空。-n 不为空,再用感叹号加个反,表示空。
等价于:
[ -z "$1" ]
-z 检测第一个输入参数是否为空。
$1 $2 代表第一个和第二个输入参数,例如下面的 shell 脚本:
./foo bar baz
则 $1 为 bar,$2 为 baz
An unhandled exception occurred: EPERM: operation not permitted, open 'C:\Users\I042416.angular-config.json
DSC0004.png

DSC0005.png

DSC0006.png
在管理员模式下运行还是报同样的错误。

DSC0007.png

也就是说,单独执行这个命令都会报错:
npm i -g @angular/cli@12.0.5
结果打脸了,单独执行上面的命令可以。这真是怪事。
DSC0008.png

还是老问题,把这个 .angular-config.json 文件的隐藏属性去掉即可:
DSC0009.png

解决了这个问题之后,就开始 build 了:
DSC00010.png

成功安装:
DSC00011.png
The installation will create two folders in the $BASE_DIR directory:

  • apps (generated/executable apps)
  • clone (cloned Spartacus repo)
FESM2015
UMD
开始构建了:
DSC00012.png

构建结果:
DSC00013.png

执行的是这些 ng build 命令:
DSC00014.png

DSC00015.png

这里多了一个 Schematics build:
DSC00016.png
DSC00017.png

DSC00018.png

这个绿色的方框正好只比包裹在里面的字符串多两个字符:
DSC00019.png
通过 printh 函数实现:
DSC00020.png

DSC00021.png

publish 到一个私有的 npm 仓库去,然后从这个私有的仓库下载库文件进行 shell app 的安装:
DSC00022.png

shell app 的安装,在 create_apps 函数里完成:
DSC00023.png
本地存储的定义:
DSC00024.png

本地 library:
DSC00025.png
可以解压查看这些本地 library 内容:
DSC00026.png
完整的源代码:
DSC00027.png
DSC00028.png

DSC00029.png

更多Jerry的原创文章,尽在:"汪子熙":
DSC00030.png
</div>
    
    <div id="asideoffset"></div>

关注下面的标签,发现更多相似文章