Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

npm build (nuxt build) does not create dist folder in amplify(aws codebuild) using nuxt spa mode

I want to create dist folder, after running 'npm build'(nuxt build) in amplify.

I run npm build in my local(mac) , then dist folder is created.

I run 'ls -a' after 'npm build' , then dist folder does not exist in amplify.

                                 > nuxt build
2019-08-20T01:49:08.598Z [INFO]: # Executing command: ls -a
2019-08-20T01:49:08.602Z [INFO]: .
                                 ..
                                 amplify.sh
                                 amplify.yml
                                 assets
                                 components
                                 .editorconfig
                                 .eslintrc.js
                                 .git
                                 .gitignore
                                 layouts
                                 middleware
                                 node_modules
                                 .nuxt
                                 nuxt.config.js
                                 package.json
                                 package-lock.json
                                 pages
                                 plugins
                                 .prettierrc
                                 README.md
                                 static
                                 store
                                 .vscode
                                 yarn.lock
                                 # Completed phase: build

here is package.json

    {
        ...
        "scripts": {
        "dev": "nuxt",
        "build": "nuxt build",
        "start": "nuxt start",
        "generate": "nuxt generate",
        "lint": "eslint --ext .js,.vue --ignore-path .gitignore .",
        "precommit": "npm run lint"
      },

here is amplify.yml

version: 0.1
frontend:
  phases:
    preBuild:
      commands:
        - npm install
    build:
      commands:
        - npm run build 
        - ls -a
  artifacts:
    # IMPORTANT - Please verify your build output directory
    baseDirectory:
        dist
    files:
      - '**/*'
  cache:
    paths:
      - node_modules/**/*

I am waitng for your answer , thanks.

like image 257
ISSEI SUZUKI Avatar asked Oct 24 '25 05:10

ISSEI SUZUKI


2 Answers

From the Nuxt documentation: https://nuxtjs.org/docs/2.x/directory-structure/dist

The dist folder, short for distribution folder. It is dynamically generated when using the nuxt generate command and includes the generated production ready HTML files and assets that are necessary to deploy and run your statically generated Nuxt.js application.

Including - npm run generate into your amplify build commands will solve this issue

version: 1
frontend:
  phases:
    preBuild:
      commands:
        - npm install
    build:
      commands:
        - npm run generate
        - npm run build
  artifacts:
    baseDirectory: dist
  ...
like image 69
njjnex Avatar answered Oct 26 '25 23:10

njjnex


I solved it setting up the amplify.yml file. I changed baseDirectory: dist to baseDirectory: .nuxt.

like image 44
orafaelreis Avatar answered Oct 26 '25 23:10

orafaelreis