将 html 和 css 文件复制到 dist，同时保持文件夹结构

Question

我正在尝试 npm 发布我的 angular2 应用程序，它具有以下结构。

search-app
  config
  node_modules
  src
    api
      --index.ts
      --ping.ts
      --search.ts  
    model
      --index.ts
      --model.ts
    web
      app
        ping
          --index.ts
          --ping.css
          --ping.html
          --ping.ts
        search
          --index.ts
          --search.css
          --search.html
          --search.ts
        --app.css
        --app.html
        --app.module.ts
        --app.ts
      --index.html
      --index.ts
package.json
tsconfig.json

现在，我的 "npm run dist" 命令是

"dist": "npm run rimraf -- dist && tsc src/index.ts src/web/index.ts src/model/index.ts -m commonjs --outDir dist --sourcemap --target es6 -d --pretty --noImplicitAny --experimentalDecorators --skipLibCheck"

运行 npm 运行 dist 会生成如下dist目录。

search-app
  dist
    api
      --*.d.ts
      --*.js 
    model
      --*.d.ts
      --*.js
    web
      app
        ping
          --*.d.ts
          --*.js
        search
          --*.d.ts
          --*.js
        --*.d.ts
        --*.js
      --index.d.ts
      --index.js

关于如何将 html 和 css 文件从 src/web 及其子目录复制到 dist/web 同时保持子目录结构的任何建议？

我基本上是在寻找可以附加到我的 dist 命令以复制 html 和 css 文件的命令。我使用 OSX，但理想的命令是同时适用于 OSX 和 windows。

Answer 1

要实现跨平台，首先安装 copyfiles 包：

$ npm i -D copyfiles

然后在package.json中添加以下copy脚本：

...
"scripts": {
  ...
  "copy": "copyfiles -u 2 \"./src/web/**/*.{css,html}\" \"./dist/web/\""
},
...

通过将 && npm run copy 链接到现有 dist 脚本的末尾来调用 copy 脚本，如下例所示：

...
"scripts": {
  "dist": "npm run rimraf -- dist && tsc src/index.ts src/web/index.ts src/model/index.ts -m commonjs --outDir dist --sourcemap --target es6 -d --pretty --noImplicitAny --experimentalDecorators --skipLibCheck && npm run copy",
  "copy": "copyfiles -u 2 \"./src/web/**/*.{css,html}\" \"./dist/web/\""
},
...

将 html 和 css 文件复制到 dist，同时保持文件夹结构

copy html and css files to dist while maintaining the folder structure

linux

macos

npm

npm-publish

angular