Triệu chứng

Bản build của bạn chạy bình thường, nhưng trình duyệt ném lỗi ngay lúc phân tích cú pháp, trước khi ứng dụng khởi động:

Một lần kiểm tra nhanh trên toàn bundle xác nhận rằng cùng một định danh được khai báo trong nhiều hơn một chunk:

Vì sao điều này xảy ra

Theo mặc định, làm rối VM dùng bộ sinh tên định danh mangled-shuffled. Nó duyệt một bảng chữ cái nhỏ theo một thứ tự xáo trộn xác định, và thêm tiền tố vm cho các biến toàn cục do runtime tạo ra. Cả hai tệp đều phát ra định danh từ cùng một chuỗi xáo trộn đó — nên biến toàn cục đầu tiên trong mỗi tệp trùng tên nhau, biến thứ hai trùng tên khác, và cứ thế.

Mỗi tệp được làm rối độc lập và bộ sinh khởi động lại từ đầu chuỗi của nó với từng tệp. Khi hai tệp cùng nằm trong một bundle, các tên sẽ trùng nhau. Hai khai báo const vmd = … ở cấp gốc rơi vào cùng một phạm vi và bộ phân tích cú pháp từ chối khai báo thứ hai.

Cách khắc phục

Hãy chọn một trong các cách sau — cách đầu tiên là giải pháp được khuyến nghị:

• Bật randomIdentifiersPrefix (khuyến nghị)

  Mỗi lần chạy làm rối sẽ nhận một tiền tố ngẫu nhiên duy nhất được thêm vào trước mọi định danh được sinh ra. Tên từ các tệp khác nhau không còn dùng chung một không gian tên nữa, nên việc trùng tên biến mất mà bạn không phải tự tay điều phối các tiền tố.

• Đặt một identifiersPrefix riêng cho mỗi tệp

  Tự truyền một tiền tố khác nhau khi làm rối từng tệp (ví dụ identifiersPrefix: 'auth_' cho tệp này, checkout_ cho tệp kia). Cách này hiệu quả, nhưng dễ sai sót nếu bạn có nhiều tệp — hãy ưu tiên tùy chọn ngẫu nhiên ở trên.

• Chuyển identifierNamesGenerator sang hexadecimal

  Tên thập lục phân dùng một không gian khóa lớn hơn nhiều, nên khả năng hai tệp sinh ra cùng một định danh là cực kỳ nhỏ. Đánh đổi: định danh dài hơn so với đầu ra mangled-shuffled, nên bundle sẽ lớn hơn một chút.

• Dùng plugin của bundler hoặc giao diện làm rối hàng loạt nhiều tệp

  Hầu hết các plugin bundler chính thức (webpack, Rollup, Vite) tự động đảm bảo tiền tố là duy nhất giữa các tệp trong một bản build. Giao diện obfuscator.io cũng xử lý việc này khi bạn dùng chế độ làm rối hàng loạt nhiều tệp. Nếu bạn tự thiết lập làm rối thủ công bằng npm API, bạn phải tự bật tiền tố ngẫu nhiên.

Các tùy chọn liên quan

• randomIdentifiersPrefix — tiền tố ngẫu nhiên cho mỗi bản build (khuyến nghị)
• identifiersPrefix — chuỗi tiền tố tường minh
• identifierNamesGenerator — dạng tên (mangled, hexadecimal, …)