Yêu cầu thg 12 20, 2019 9:27 SA 396 0 3
  • 396 0 3
0

Không Hiển Thị App VueJS khi dùng npm run build

Chia sẻ
  • 396 0 3

Khi mình dùng npm run build để build ra folder dist nhưng khi mở file html trong thư mục dist lên thì k hiển thị gì ạ? file html của mình

<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1"><link rel=icon href=/favicon.ico><title>my-app</title><link href=/css/chunk-43b67b9e.bd5fa8da.css rel=prefetch><link href=/js/chunk-2c9f3c85.4385e80c.js rel=prefetch><link href=/js/chunk-2d0c8074.586e0002.js rel=prefetch><link href=/js/chunk-2d0d7c65.50d46aad.js rel=prefetch><link href=/js/chunk-2d0efcba.2e8ba2d6.js rel=prefetch><link href=/js/chunk-2d20f022.e06e0bfe.js rel=prefetch><link href=/js/chunk-2d217357.cce83bd5.js rel=prefetch><link href=/js/chunk-43b67b9e.dc1c0d3e.js rel=prefetch><link href=/js/chunk-48ef169d.466b54ca.js rel=prefetch><link href=/js/chunk-a5944ffe.f41e2d1e.js rel=prefetch><link href=/css/app.b0893e6d.css rel=preload as=style><link href=/css/chunk-vendors.db599641.css rel=preload as=style><link href=/js/app.eb48ce3a.js rel=preload as=script><link href=/js/chunk-vendors.335c3f5c.js rel=preload as=script><link href=/css/chunk-vendors.db599641.css rel=stylesheet><link href=/css/app.b0893e6d.css rel=stylesheet></head><body><noscript><strong>We're sorry but my-app doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id=app></div><script src=https://code.jquery.com/jquery-3.1.1.slim.min.js crossorigin=anonymous></script><script src=https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js></script><script src=/js/chunk-vendors.335c3f5c.js></script><script src=/js/app.eb48ce3a.js></script></body></html>

Avatar TAMIX @tuananhbfs
thg 12 21, 2019 1:14 SA

mô tả cụ thể kèm hình ảnh đi bạn

3 CÂU TRẢ LỜI


Đã trả lời thg 12 24, 2019 2:05 SA
Đã được chấp nhận
+4

Bạn chưa đọc kĩ doc của VueJS rồi, khi bạn build project bằng npm run build, Bạn không thể chỉ mở mỗi file index.html để chạy project mà bạn cần 1 webserver để làm điều đó. 1 trong những cách đơn giản đó là bạn tạo 1 server NodeJS Express với 1 route nào đó (ví dụ /) và trả về file index.html là được nhé.

Chi tiết ở trang chủ Vue-cli

Còn khi để chạy thật (production) thì bạn có thể vẫn dùng server NodeJS Express, nhưng cách mình khuyên là dùng 1 webserver như Nginx (hoặc Apache)

Chia sẻ
Đã trả lời thg 12 23, 2019 2:12 SA
0

Nếu chỉ vào được trang chủ, sang suburl mà f5 không load được thì khả năng do bạn chưa config router trên server.

Chia sẻ
Đã trả lời thg 3 2, 2020 10:07 SA
0

Có 2 cách:

  1. bạn mở file index.html trong dist bằng liveserver - một ext của vscode,.
  2. Bạn sửa lại đường dẫn load file trong file index.html thành đường dẫn tương đối. vue build ra xong file index.html thì các đường dẫn css,js bên trong thường là đường dẫn tuyệt đối. bạn mở file trực tiếp bằng trình duyệt thì sẽ ko load được các đường dẫn tuyệt đối này.
Chia sẻ
Viblo
Hãy đăng ký một tài khoản Viblo để nhận được nhiều bài viết thú vị hơn.
Đăng kí