Docker-compose up does not reflect i18n translation file changes despite successful npm build

[k-brahma]

Self Checks

• [X] This is only for bug report, if you would like to ask a question, please head to Discussions.
• [X] I have searched for existing issues search for existing issues, including closed ones.
• [X] I confirm that I am using English to submit this report (我已阅读并同意 Language Policy).
• [X] [FOR CHINESE USERS] 请务必使用英文提交 Issue，否则会被关闭。谢谢！:）
• [X] Please do not modify this template :) and fill in all the required fields.

Dify version

0.6.16

Cloud or Self Hosted

Self Hosted (Docker)

Steps to reproduce

Docker-compose up does not reflect i18n translation file changes despite successful npm build

Description

I've made changes to web/i18n/ja-JP/dataset-documents.ts and successfully built the project with npm. However, these changes are not reflected in the UI when running the application with Docker Compose.

Steps to Reproduce

1. Edit the file /path/to/dify/web/i18n/ja-JP/dataset-documents.ts:

   embeddingTime: '埋め込み時間', // Embedding time
   embeddedSpend: '埋め込みコスト', // Embedded spend, changed from '埋め込み時間'

2. Build the project:

   npm --version
   # Output: 10.8.2
   cd /path/to/dify/
   npm ci
   cd web/
   npm ci
   npm run build

3. Verify changes in built files:

   cd /path/to/dify/web/.next/server
   grep -r -l "埋め込みコスト" .
   # Output:
   # ./chunks/5638.js
   # ./chunks/535.js
   
   for file in ./chunks/5638.js ./chunks/535.js; do
      echo "File: $file"
      grep -o -P '.{0,50}埋め込みコスト.{0,50}' "$file"
      echo
   done

   Output:

   File: ./chunks/5638.js
   ount:"検索回数",embeddingTime:"埋め込み時間",embeddedSpend:"埋め込みコスト"}},languageMap:{zh:"中国語",en:"英語",es:"スペイン語",fr:"フ
   File: ./chunks/535.js
   ount:"検索回数",embeddingTime:"埋め込み時間",embeddedSpend:"埋め込みコスト"}},languageMap:{zh:"中国語",en:"英語",es:"スペイン語",fr:"フ

4. Launch Docker containers:

   cd /path/to/dify/docker
   sudo docker-compose up --build --force-recreate

5. Check the UI in browser window to avoid cache issues.

Additional Information

• npm version: 10.8.2
• Checked in a new browser session to rule out cache-related issues.
• The changes are visible in the built JavaScript files but not reflected in the Docker environment.

Possible Causes

• Docker caching issue
• Incorrect volume mounting in Docker Compose
• Misconfiguration in the way Docker serves the built files

Any insights or suggestions on how to resolve this discrepancy between the built files and the Docker environment would be greatly appreciated.

✔️ Expected Behavior

In the 技術的なパラメータ (Technical parameters) section, the second label should display "埋め込みコスト" instead of "埋め込み時間".

<div class="style_fieldInfo__EC18B"><div class="style_label__FWwCP">埋め込み時間</div><div class="style_value__5bJPa">0.83 sec</div></div>
<div class="style_fieldInfo__EC18B"><div class="style_label__FWwCP">埋め込みコスト</div><div class="style_value__5bJPa">0 tokens</div></div>

❌ Actual Behavior

The UI still displays:

<div class="style_fieldInfo__EC18B"><div class="style_label__FWwCP">埋め込み時間</div><div class="style_value__5bJPa">0.83 sec</div></div>
<div class="style_fieldInfo__EC18B"><div class="style_label__FWwCP">埋め込み時間</div><div class="style_value__5bJPa">0 tokens</div></div>

[dosubot[bot]]

@k-brahma Hello! I'm here to help you with your bug report. I can assist with bug resolution, answer questions, and guide you on becoming a contributor. Let's dive in and tackle this issue together.

To resolve the issue where changes to your i18n translation files are not being reflected in the UI when running your application with Docker Compose, despite a successful npm build, you should ensure that the Docker container is not using cached layers that might contain old versions of your translation files. You can force Docker Compose to rebuild the images without using the cache by using the --no-cache option.

Here is the command you can use:

docker-compose build --no-cache
docker-compose up

This will ensure that the Docker image is rebuilt from scratch, incorporating the latest changes to your i18n translation files ^[1].

To continue talking to Dosu, mention @dosu.

[crazywoola]

In order to make the changes available if you use docker compose to start the container, you need to rebuild the image. Otherwise it will use the tag to start the container, if you are using source code, then the command npm run build will be available.

Update:

This command only use the tag to start the container.

docker-compose up --build --force-recreate

https://github.com/langgenius/dify/blob/d839f1ada77aede5059d900ed369710e3c526476/docker/docker-compose.yaml#L222-L229

[k-brahma]

@crazywoola, thank you for your reply.

I've followed your suggestion and recorded the whole process in this 80-second video: https://github.com/user-attachments/assets/82b04f74-8312-4958-9074-7a6a72a9db24

The video demonstrates the following steps:

1. Checking the UI, where the changes are not initially reflected
2. Verifying the file has been updated
3. Executing docker-compose build --no-cache
4. Starting the containers with docker-compose up
5. Re-checking the UI with no-cached browser, where the changes are STILL not reflected

Later I tried to use command docker-compose up --build --force-recreate but nothing changed.

What am I missing or doing wrong? If I missed any steps required, please advise me.

I'd greatly appreciate any insights or further suggestions you might have based on what you observe in the video.

[crazywoola]

Hello @k-brahma

I usually test i18n localization changes by following steps:

1. Change the texts
2. Run yarn dev or npm.
3. Verify the changes in the UI interface.

If you want to check this in the docker image. You should do the following things

1. Change the texts
2. Rebuild the image by running docker build -t some new tag here let's name it into 0.6.16-fix1
3. Stop the container by running docker compose down
4. Replace the tag here in this line https://github.com/langgenius/dify/blob/d839f1ada77aede5059d900ed369710e3c526476/docker/docker-compose.yaml#L224
5. And restart the application by docker compose up

The changes isn't available because if you run npm run build, changes only available for the local environment and it's not copied into the container.

[k-brahma]

@crazywoola

Thank you.

Using docker I finally made it and confirmed my update works :)

For npm run dev there's still something I failed (api 5000 access refused ...) but later I will try to handle it.

I close this issue. Again many thanks!!

[k-brahma]

@crazywoola

With instrcurtion in /path/to/dify/api/README.md I could launce api server then npm run dev, then confirmed the lang file update.

Again, thank you for your advice.