Vue.js webpack的導出代碼

Question

這是我第一次使用前端構建工具。在過去，我從來沒有使用任何類型的框架，安裝起來比在我的html頁面頂部添加一個<script>標籤更復雜。現在你知道我的知識水平了。

我有一個這樣的vue.js/vuetify與目錄結構中的應用：

我認爲它開始與vuetify /的WebPack先進的模板。 我正試圖將該項目導出爲可以聯機的項目。我想我可以運行某種類型的命令，將所有代碼生成爲.html，.css和.js文件，然後我可以連接到任何我想要的後端。

如果我的假設是正確的，那是怎麼做的，那麼怎麼處理路由呢？整個網站只是在一個HTML文件？

我認爲webpack應該這樣做嗎？但是，當我嘗試從命令行運行webpack時，I get command not found。

如果我的假設是錯誤的，那麼我如何獲得這個在線？

Answer 1

使用npm run build命令。您可以看到該命令在package.json文件，腳本對象內執行的操作。

"scripts": { 
    "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot", 
    "build": "cross-env NODE_ENV=production webpack --progress --hide-modules" 
} 

你的整個網站會被編譯成index.html文件和文件build.js位於該/dist文件夾中。運行npm run build命令時會生成/dist文件夾和build.js。確保index.html中的腳本src指向您的build.js文件。