镜像概述
本Docker镜像用于运行https://github.com/SharePoint/sp-dev-docs%EF%BC%88%E7%AE%80%E7%A7%B0SPFx%EF%BC%89%EF%BC%8C%E6%8F%90%E4%BE%9B%E4%BA%86%E9%A2%84%E9%85%8D%E7%BD%AE%E7%9A%84%E5%BC%80%E5%8F%91%E7%8E%AF%E5%A2%83%EF%BC%8C%E6%97%A0%E9%9C%80%E5%9C%A8%E4%B8%BB%E6%9C%BA%E7%B3%BB%E7%BB%9F%E4%B8%8A%E7%9B%B4%E6%8E%A5%E5%AE%89%E8%A3%85SPFx%E4%BE%9D%E8%B5%96%E3%80%82%E9%80%9A%E8%BF%87%E5%AE%B9%E5%99%A8%E5%8C%96%E6%96%B9%E5%BC%8F%EF%BC%8C%E5%8F%AF%E5%BF%AB%E9%80%9F%E6%90%AD%E5%BB%BA%E9%9A%94%E7%A6%BB%E7%9A%84SPFx%E5%BC%80%E5%8F%91%E7%8E%AF%E5%A2%83%EF%BC%8C%E6%94%AF%E6%8C%81%E9%A1%B9%E7%9B%AE%E6%96%87%E4%BB%B6%E6%98%A0%E5%B0%84%E5%88%B0%E4%B8%BB%E6%9C%BA%E7%B3%BB%E7%BB%9F%EF%BC%8C%E4%BE%BF%E4%BA%8E%E7%89%88%E6%9C%AC%E6%8E%A7%E5%88%B6%E5%92%8C%E6%96%87%E4%BB%B6%E7%AE%A1%E7%90%86%E3%80%82
核心功能与特性
- 预安装开发工具:包含SPFx Yeoman生成器及相关依赖,可直接创建和开发SPFx项目
- 多版本支持:提供多个标签对应不同SPFx版本,满足不同项目需求
- 文件系统映射:项目文件存储在主机目录,支持直接通过主机工具编辑和版本控制
- 端口映射:默认映射开发所需端口(4321用于工作区,35729用于热重载)
- 跨平台兼容:支持macOS、Windows等主流操作系统的Docker环境
使用场景
- SharePoint Framework项目的快速初始化与开发
- 多版本SPFx项目并行开发(通过不同镜像标签切换环境)
- 避免主机环境依赖冲突,保持开发环境一致性
- 团队协作中统一开发环境配置
使用方法
前置准备
- 确保Docker已安装并运行
- 在Docker设置 > 共享驱动器中,验证项目所在驱动器已启用共享
启动容器
根据操作系统和shell环境,执行以下命令:
macOS(命令行)
sh
cd [你的项目目录]
docker run -it --rm --name ${PWD##*/} -v $PWD:/usr/app/spfx -p 4321:4321 -p 35729:35729 m365pnp/spfx
Windows PowerShell
PowerShell
cd [你的项目目录]
docker run -it --rm --name spfx-helloworld -v ${PWD}:/usr/app/spfx -p 4321:4321 -p 35729:35729 m365pnp/spfx
Windows 其他shell(如cmd)
cmd
cd [你的项目目录]
docker run -it --rm --name spfx-helloworld -v %cd%:/usr/app/spfx -p 4321:4321 -p 35729:35729 m365pnp/spfx
开发项目
容器启动后,即可像在本地安装SPFx一样操作:
- 在容器命令行中执行以下命令创建新项目:
sh
yo @microsoft/sharepoint
- 生成器创建的所有文件将存储在主机的项目目录中,可直接提交到版本控制
退出容器
在容器命令行中执行以下命令关闭容器:
可用标签
镜像提供以下标签,对应不同版本的SharePoint Framework Yeoman生成器:
- latest:包含1.21.1版本的SPFx Yeoman生成器
- online:包含1.21.1版本的SPFx Yeoman生成器
- onprem:包含https://github.com/sharepoint/sp-dev-docs/wiki/Release-Notes-for-SPFx-Package-Version-1.4.1%E7%89%88%E6%9C%AC%E7%9A%84SPFx Yeoman生成器
- 1.21.1:包含1.21.1版本的SPFx Yeoman生成器
- 1.21.0:包含1.21.0版本的SPFx Yeoman生成器
- 1.20.0:包含1.20.0版本的SPFx Yeoman生成器
- 1.19.0:包含1.19.0版本的SPFx Yeoman生成器
- 1.18.2:包含1.18.2版本的SPFx Yeoman生成器
- 1.18.1:包含1.18.1版本的SPFx Yeoman生成器
- 1.18.0:包含1.18.0版本的SPFx Yeoman生成器
- 1.17.4:包含1.17.4版本的SPFx Yeoman生成器
- 1.17.3:包含1.17.3版本的SPFx Yeoman生成器
- 1.17.2:包含1.17.2版本的SPFx Yeoman生成器
- 1.17.1:包含1.17.1版本的SPFx Yeoman生成器
- 1.17.0:包含1.17.0版本的SPFx Yeoman生成器
- 1.16.1:包含1.16.1版本的SPFx Yeoman生成器
- 1.16.0:包含1.16.0版本的SPFx Yeoman生成器
- 1.15.2:包含1.15.2版本的SPFx Yeoman生成器
- 1.15.0:包含1.15.0版本的SPFx Yeoman生成器
- 1.14.0:包含1.14.0版本的SPFx Yeoman生成器
- 1.13.1:包含1.13.1版本的SPFx Yeoman生成器
- 1.13.0:包含1.13.0版本的SPFx Yeoman生成器
- 1.12.1:包含1.12.1版本的SPFx Yeoman生成器
- 1.12.0:包含SPFx 1.12.0版本的Yeoman生成器
- 1.11.0:包含1.11.0版本的SPFx Yeoman生成器
- 1.10.0:包含https://github.com/sharepoint/sp-dev-docs/wiki/SharePoint-Framework-v1.10-release-notes%E7%89%88%E6%9C%AC%E7%9A%84SPFx Yeoman生成器
- 1.9.1:包含https://github.com/sharepoint/sp-dev-docs/wiki/SharePoint-Framework-v1.9.1-release-notes%E7%89%88%E6%9C%AC%E7%9A%84SPFx Yeoman生成器
- 1.8.2:包含https://github.com/sharepoint/sp-dev-docs/wiki/SharePoint-Framework-v1.8.2-release-notes%E7%89%88%E6%9C%AC%E7%9A%84SPFx Yeoman生成器
- 1.8.1:包含https://github.com/sharepoint/sp-dev-docs/wiki/SharePoint-Framework-v1.8.1-release-notes%E7%89%88%E6%9C%AC%E7%9A%84SPFx Yeoman生成器
- 1.8.0:包含https://github.com/sharepoint/sp-dev-docs/wiki/SharePoint-Framework-v1.8-release-notes%E7%89%88%E6%9C%AC%E7%9A%84SPFx Yeoman生成器
- 1.7.1:包含https://github.com/sharepoint/sp-dev-docs/wiki/Release-Notes-for-SPFx-Package-Version-1.7.1%E7%89%88%E6%9C%AC%E7%9A%84SPFx Yeoman生成器
- 1.7.0:包含https://github.com/SharePoint/sp-dev-docs/wiki/SharePoint-Framework-v1.7-release-notes%E7%89%88%E6%9C%AC%E7%9A%84SPFx Yeoman生成器
- 1.6.0:包含https://github.com/sharepoint/sp-dev-docs/wiki/v-1.6-release-notes%E7%89%88%E6%9C%AC%E7%9A%84SPFx Yeoman生成器
- 1.5.1:包含https://github.com/SharePoint/sp-dev-docs/wiki/Release-Notes-for-SPFx-Package-Version-1.5.1%E7%89%88%E6%9C%AC%E7%9A%84SPFx Yeoman生成器
- 1.5.0:包含https://github.com/sharepoint/sp-dev-docs/wiki/Release-Notes-for-SharePoint-Framework-Package-v1.5%E7%89%88%E6%9C%AC%E7%9A%84SPFx Yeoman生成器
- 1.4.1:包含https://github.com/sharepoint/sp-dev-docs/wiki/Release-Notes-for-SPFx-Package-Version-1.4.1%E7%89%88%E6%9C%AC%E7%9A%84SPFx Yeoman生成器
- 1.4.0:包含https://github.com/SharePoint/sp-dev-docs/wiki/Release-Notes-for-SPFx-Package-Version-1.4%E7%89%88%E6%9C%AC%E7%9A%84SPFx Yeoman生成器
- 1.3.4:包含1.3.4版本的SPFx Yeoman生成器
- 1.3.2:包含SPFx 1.3.2版本的Yeoman生成器
- 1.3.1:包含SPFx 1.3.1版本的Yeoman生成器
- 1.3.0:包含SPFx 1.3.0版本的Yeoman生成器
- 1.2.0:包含https://github.com/SharePoint/sp-dev-docs/wiki/Release-Notes---Extensions-RC-Drop-1.2%E7%89%88%E6%9C%AC%E7%9A%84SPFx Yeoman生成器
- 1.1.3:包含SPFx 1.1.3版本的Yeoman生成器
- 1.1.1:包含https://github.com/SharePoint/sp-dev-docs/wiki/Release-Notes---Extensions-Dev-Preview-Drop-1%E7%89%88%E6%9C%AC%E7%9A%84SPFx Yeoman生成器
- 1.1.0:包含https://github.com/SharePoint/sp-dev-docs/wiki/Release-Notes---Extensions-Dev-Preview-Drop-1%E7%89%88%E6%9C%AC%E7%9A%84SPFx Yeoman生成器
- 1.0.2:包含SPFx 1.0.2版本的Yeoman生成器
- ga:包含https://github.com/SharePoint/sp-dev-docs/wiki/Release-Notes-GA%E7%89%88%E6%9C%AC%E7%9A%84SPFx Yeoman生成器
- rc0:包含https://github.com/SharePoint/sp-dev-docs/wiki/Release-Notes-RC0%E7%89%88%E6%9C%AC%E7%9A%84SPFx Yeoman生成器
- drop-6:包含https://github.com/SharePoint/sp-dev-docs/wiki/Release-Notes-Drop-6%E7%89%88%E6%9C%AC%E7%9A%84SPFx Yeoman生成器
- drop-5:包含https://github.com/SharePoint/sp-dev-docs/wiki/Release-Notes-Drop-5%E7%89%88%E6%9C%AC%E7%9A%84SPFx Yeoman生成器
- drop-4:包含https://github.com/SharePoint/sp-dev-docs/wiki/Release-Notes-Drop-4-and-MDL2%E7%89%88%E6%9C%AC%E7%9A%84SPFx Yeoman生成器
已知问题
无法写入文件到磁盘
执行yo @microsoft/sharepoint时提示无法写入文件,通常是因为Docker未共享项目所在驱动器。解决方法:进入Docker > 设置 > 共享,启用项目所在驱动器的共享。
SharePoint Framework >=1.14.0无法访问workbench和bundle
使用SPFx >=v1.14.0版本时,无法访问本地workbench或加载bundle,原因是workbench默认映射到localhost,容器外部无法访问。解决方法:修改项目中的./config/serve.json文件为:
json
{
"$schema": "https://developer.microsoft.com/json-schemas/core-build/serve.schema.json",
"port": 4321,
"ipAddress": "0.0.0.0",
"https": true,
"initialPage": "https://enter-your-SharePoint-site/_layouts/workbench.aspx"
}
SharePoint Framework >=1.6.0 <=1.13.1无法访问workbench和bundle
使用SPFx >=v1.6.0且<=v1.13.1版本时,类似问题的解决方法:修改./config/serve.json文件为:
json
{
"$schema": "https://developer.microsoft.com/json-schemas/core-build/serve.schema.json",
"port": 4321,
"hostname": "0.0.0.0",
"https": true,
"initialPage": "https://enter-your-SharePoint-site/_layouts/workbench.aspx"
}
SharePoint Framework 1.13.1无法访问bundle
修改node_modules\@microsoft\spfx-heft-plugins\lib\plugins\webpackConfigurationPlugin\WebpackConfigurationGenerator.js:393:
原代码:
javascript
const debugBaseUrl = `${serveConfig.https ? 'https' : 'http'}://${serveConfig.hostname || 'localhost'}:${serveConfig.port || 4321}/${distFolderName}/`;
修改为:
javascript
const debugBaseUrl = `${serveConfig.https ? 'https' : 'http'}://localhost:${serveConfig.port || 4321}/${distFolderName}/`;
SharePoint Framework 1.12.1无法访问bundle
修改node_modules\@microsoft\spfx-heft-plugins\lib\plugins\webpackConfigurationPlugin\WebpackConfigurationGenerator.js:376:
原代码:
javascript
const debugBaseUrl = `${serveConfig.https ? 'https' : 'http'}://${serveConfig.hostname || 'localhost'}:${serveConfig.port || 4321}/dist/`;
修改为:
javascript
const debugBase