Nest-cli: Copy content of assets folder to target dist

Created on 7 Jun 2019  路  11Comments  路  Source: nestjs/nest-cli

Files unknown for typescript compiler, assets file should be copied during build

My custom middleware is processing files, which are not .ts nor .js file (actually it is yaml + some other) and everytime when build happens I have to copy manually files to dist folder.

Describe the solution you'd like

Angular build process will copy everything from assets folder to target build folder. It is configured in
`
----angular.json------

"assets": [
"src/favicon.ico",
"src/assets"
],`

Teachability, Documentation, Adoption, Migration Strategy

For sure this issue can be fixed by npm script or by other means, but if NestJs follows Angular philosophy, you can skip manual steps of copying resources and framework will be similar to Angular.

Most helpful comment

One option that you have is using the "assets" option in the compiler. Is detailed in the documentation here to be used in monorepos but I have been using it in my repositories without issues.

Basically all you need to do is add:

"compilerOptions": {
  "assets": [
    "**/*.env"
  ]
}

To the nest-cli.json, in my example I'm moving all the .env files to the dist folder.

Hope that helps!

All 11 comments

I think there is no built in solution for this. Currently in my project i am using a plugin called cpx from npm repository. You are free to use any copy plugin for that matter. I have added it alongside my build scripts in package.json like so

"build": "tsc -p tsconfig.build.json && npm run copy:assets",
"format": "prettier --write \"src/**/*.ts\"",
"start": "ts-node -r tsconfig-paths/register src/main.ts",
"start:dev": "concurrently --handle-input \"wait-on dist/main.js && npm run copy:assets && nodemon\" \"tsc -w -p tsconfig.build.json\"",
"start:debug": "nodemon --config nodemon-debug.json",
"prestart:prod": "rimraf dist && npm run build",
"start:prod": "node dist/main.js",
"lint": "tslint -p tsconfig.json -c tslint.json",
"test": "jest",
"test:watch": "jest --watch",
"test:cov": "jest --coverage",
"test:debug": "node --inspect-brk -r tsconfig-paths/register -r ts-node/register node_modules/.bin/jest --runInBand",
"test:e2e": "jest --config ./test/jest-e2e.json",
"copy:assets": "cpx 'src/assets/**' 'dist/assets'"

Check out the copy:assets build script. This copies all my static assets from src folder to the dist folder when build scripts are run. You can run the script alongside any of the build scripts above using npm run copy:assets. Hope this helps you

copy:assets

not copy: templates -))

copy:assets

not copy: templates -))

My bad :) I had this name in my project. Had to change it to assets while posting. Updated my comments above 馃憤

The majority of NestJS projects don't even use assets. We don't have dedicated builders - we use tsc compiler. If you need to move templates as an additional compilation step, I'd suggest writing a script. Example here https://stackoverflow.com/questions/30191248/how-to-add-a-post-tsc-build-task-that-copy-files/44283813

Like @sandeepsuvit said, you only need to create a new entry in yorur package.json file and do whatever you need inside it. In my case, a recursive copy is enough:
"scripts": { "build": "npm run copy-assets && tsc -p tsconfig.build.json", "copy-assets": "cp -rv src/assets/i18n dist/assets/", "prestart:prod": "rimraf dist && npm run copy-assets && npm run build", "start:prod": "node dist/main.js", }
And all my i18n files are copied to dist directory.

Best regards!

One option that you have is using the "assets" option in the compiler. Is detailed in the documentation here to be used in monorepos but I have been using it in my repositories without issues.

Basically all you need to do is add:

"compilerOptions": {
  "assets": [
    "**/*.env"
  ]
}

To the nest-cli.json, in my example I'm moving all the .env files to the dist folder.

Hope that helps!

Another option to include a whole folder would be:

{
    "collection": "@nestjs/schematics",
    "sourceRoot": "src",
    "compilerOptions": {
        "assets": [
            "resources/**/*"
        ]
    }
}

Another option to include a whole folder would be:

{
    "collection": "@nestjs/schematics",
    "sourceRoot": "src",
    "compilerOptions": {
        "assets": [
            "resources/**/*"
        ]
    }
}

Perfect

I think there is no built in solution for this. Currently in my project i am using a plugin called cpx from npm repository. You are free to use any copy plugin for that matter. I have added it alongside my build scripts in package.json like so

"build": "tsc -p tsconfig.build.json && npm run copy:assets",
"format": "prettier --write \"src/**/*.ts\"",
"start": "ts-node -r tsconfig-paths/register src/main.ts",
"start:dev": "concurrently --handle-input \"wait-on dist/main.js && npm run copy:assets && nodemon\" \"tsc -w -p tsconfig.build.json\"",
"start:debug": "nodemon --config nodemon-debug.json",
"prestart:prod": "rimraf dist && npm run build",
"start:prod": "node dist/main.js",
"lint": "tslint -p tsconfig.json -c tslint.json",
"test": "jest",
"test:watch": "jest --watch",
"test:cov": "jest --coverage",
"test:debug": "node --inspect-brk -r tsconfig-paths/register -r ts-node/register node_modules/.bin/jest --runInBand",
"test:e2e": "jest --config ./test/jest-e2e.json",
"copy:assets": "cpx 'src/assets/**' 'dist/assets'"

Check out the copy:assets build script. This copies all my static assets from src folder to the dist folder when build scripts are run. You can run the script alongside any of the build scripts above using npm run copy:assets. Hope this helps you

Wonderful plugin. This works perfectly...

Why on earth is there no native solution? Of course, an asset folder is required in almost every project. Crazy...

I think there is no built in solution for this. Currently in my project i am using a plugin called cpx from npm repository. You are free to use any copy plugin for that matter. I have added it alongside my build scripts in package.json like so

"build": "tsc -p tsconfig.build.json && npm run copy:assets",
"format": "prettier --write \"src/**/*.ts\"",
"start": "ts-node -r tsconfig-paths/register src/main.ts",
"start:dev": "concurrently --handle-input \"wait-on dist/main.js && npm run copy:assets && nodemon\" \"tsc -w -p tsconfig.build.json\"",
"start:debug": "nodemon --config nodemon-debug.json",
"prestart:prod": "rimraf dist && npm run build",
"start:prod": "node dist/main.js",
"lint": "tslint -p tsconfig.json -c tslint.json",
"test": "jest",
"test:watch": "jest --watch",
"test:cov": "jest --coverage",
"test:debug": "node --inspect-brk -r tsconfig-paths/register -r ts-node/register node_modules/.bin/jest --runInBand",
"test:e2e": "jest --config ./test/jest-e2e.json",
"copy:assets": "cpx 'src/assets/**' 'dist/assets'"

Check out the copy:assets build script. This copies all my static assets from src folder to the dist folder when build scripts are run. You can run the script alongside any of the build scripts above using npm run copy:assets. Hope this helps you

Wonderful plugin. This works perfectly...

Why on earth is there no native solution? Of course, an asset folder is required in almost every project. Crazy...

Hi you can do this now natively using nest-cli.json, no need of any additional plugins to be installed. You can export as many folders into your dist directory like so
Checkout the assets block in compilerOptions. In this case it will copy i18n, templates, assets folders to dist directory

{
    "collection": "@nestjs/schematics",
    "sourceRoot": "src",
    "compilerOptions": {
        "assets": [
            "i18n/**/*",
            "templates/**/*",
            "assets/**/*"
        ]
    }
}

@charlesr1971 Please, read the documentation https://docs.nestjs.com/cli/monorepo#assets

Of course, an asset folder is required in almost every project. Crazy...

That's not true.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

John0x picture John0x  路  6Comments

METACEO picture METACEO  路  6Comments

jylin picture jylin  路  5Comments

victordidenko picture victordidenko  路  4Comments

iangregsondev picture iangregsondev  路  6Comments