Vue014_ vue 项目的打包与发布
? 模板項目的結構
|-- build : webpack 相關的配置文件夾(基本不需要修改)
|-- dev-server.js : 通過 express 啟動后臺服務器
|-- config: webpack 相關的配置文件夾(基本不需要修改)
|-- index.js: 指定的后臺服務的端口號和靜態資源文件夾
|-- node_modules
|-- src : 源碼文件夾
|-- components: vue 組件及其相關資源文件夾
|-- App.vue: 應用根主組件
|-- main.js: 應用入口 js
|-- static: 靜態資源文件夾
|-- .babelrc: babel 的配置文件
|-- .eslintignore: eslint 檢查忽略的配置
|-- .eslintrc.js: eslint 檢查的配置
|-- .gitignore: git 版本管制忽略的配置
|-- index.html: 主頁面文件
|-- package.json: 應用包配置文件
|-- README.md: 應用描述說明的 readme 文件
? 項目的打包與發布
打包:
npm run build
發布 1: ?使用靜態服務器工具包
npm install -g serve
serve dist
訪問: http://localhost:5000
?
發布 2: ?使用動態 web ?服務器(tomcat)
修改配置: webpack.prod.conf.js
output: {
publicPath: '/xxx/' //打包文件夾的名稱
}
重新打包:
npm run build
修改 dist 文件夾為項目名稱: xxx
將 xxx 拷貝到運行的 tomcat 的 webapps 目錄下
訪問: http://localhost:8080/xxx
?
?
?
?
?
?
?
?
?
?
總結
以上是生活随笔為你收集整理的Vue014_ vue 项目的打包与发布的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Vue013_ vue组件化编码
- 下一篇: npm ERR! code ELIFEC