2016年3月16日 星期三

msbuild copy files - Illegal characters in path error

遇到一個 msbuild 的問題讓我十分困擾,
目前處理的專案,用到 aps.net MVC5 + Angular 2 ,以 npm 進行安裝
希望透過 msbuild 將專案 build 過後,也順道把 node_module 資料夾 copy 至 build 資料夾,
但是卻遇到 Illegal characters in path 的錯誤訊息:



所用的也是很正常的 msbuild task

<CreateItem Include="$(SourceDir)\**\*.*" Exclude="$(SourceDir)\.bin\**\*.*;">
    <Output TaskParameter="Include" ItemName="NodeModulesFileItems" />
</CreateItem>
<Copy SourceFiles="@(FileItems)" DestinationFiles=
    "@(FileItems->'$(OutputDir)\%(RecursiveDir)%(Filename)%(Extension)')" />

先來查看 package.json ,看看 node_module 放了哪些 package,如下:
{
  "name": "angular2-quickstart",
  "version": "1.0.0",
  "private": true,
  "dependencies": {
    "angular2": "2.0.0-beta.0",
    "systemjs": "0.19.6",
    "es6-promise": "^3.0.2",
    "es6-shim": "^0.33.3",
    "reflect-metadata": "0.1.2",
    "rxjs": "5.0.0-beta.0",
    "zone.js": "0.5.10"
  },
  "devDependencies": {
    "gulp-typescript": "^2.10.0",
    "gulp": "^3.9.0"
  }
}

所以原因出在 node_modules 這個資料夾到底出了什麼事!? 來實驗看看吧!

假設專案路徑是: C:\project\webapp
如果 copy 的路徑是:C:\project\webapp\Content    成功
如果 copy 的路徑是:C:\project\webapp\Image   成功
如果 copy 的路徑是:C:\project\webapp\node_modules  失敗
如果 copy 的路徑是:C:\project\webapp\node_modules\angular2  成功
如果 copy 的路徑是:C:\project\webapp\node_modules\systemjs  成功
如果 copy 的路徑是:C:\project\webapp\node_modules\es6-promise  成功
如果 copy 的路徑是:C:\project\webapp\node_modules\es6-shim  成功
如果 copy 的路徑是:C:\project\webapp\node_modules\reflect-metadata  成功
如果 copy 的路徑是:C:\project\webapp\node_modules\rxjs  成功
如果 copy 的路徑是:C:\project\webapp\node_modules\zone.js  成功
如果 copy 的路徑是:C:\project\webapp\node_modules\gulp-typescript  失敗
如果 copy 的路徑是:C:\project\webapp\node_modules\gulp  失敗

最後終於發現是 gulp, gulp-typescript 兩個資料夾在做怪,
由於這兩個資料夾裡面的檔案結構又深又長,導致 copy task 在複製檔案時,
因路徑太長而拋出 Illegal characters in path  訊息,
那該如何處理呢?

在發佈時,先將這兩個資料夾刪掉,以暫時解決這個問題,
使用 removedir task 刪除資料夾,
但是仍然會發生 Illegal characters in path 錯誤,我想問題應該是跟上面一樣
<removedir directories="$(dir)"></removedir>
所以只好依靠 windows command - rmdir 來處理
<Exec Command="RMDIR /S /Q $(WebNodeModulesSourceDir)\gulp"/>
<Exec Command="RMDIR /S /Q $(WebNodeModulesSourceDir)\gulp-typescript"/>

<CreateItem Include="$(SourceDir)\**\*.*" Exclude="$(SourceDir)\.bin\**\*.*;">
    <Output TaskParameter="Include" ItemName="NodeModulesFileItems" />
</CreateItem>
<Copy SourceFiles="@(FileItems)" DestinationFiles=
    "@(FileItems->'$(OutputDir)\%(RecursiveDir)%(Filename)%(Extension)')" />

打完收工!

2016/04/21 更新: 安裝新版的 NPM,即可解決此問題,參考

沒有留言:

張貼留言