打包vue項目,並利用webpack運行在本地

打包後的項目生成的dist文件能夠部署到 express 服務器上運行html

1. 打包vue項目

(1)cd vue項目vue

(2)npm run bulidwebpack

(3)打包完會生成dist文件夾。如圖:web

(4)注意:若是此時打開dist下的index.htmlexpress

頁面將一片空白,而且報錯npm

vue打包的項目不能直接打開,由於直接打開的的協議是file,vue項目必須放在服務器上才能打開瀏覽器

2. 利用webpack運行vue項目

(1) cd 到新目錄服務器

(2)安裝express-generator生成器htm

npm install express-generator -gblog

(3) 建立一個express項目

express test (test是項目名)

(4)cd test

(5) npm install

(6)把vue項目dist下的全部文件拷貝到webpack項目(test)的public目錄下

(5)npm start

啓動express項目

打開瀏覽器,輸入 http://localhost:3000 便可

相關文章
相關標籤/搜索