在Azure Web App上部署vueJs应用程序

时间:2018-01-10 05:06:48

标签: azure webpack vue.js azure-web-sites

我创建了一个vueJs App。

我想在Azure网络应用上部署它。

    "scripts": {
    "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
    "prod": "webpack --progress --config build/webpack.prod.conf.js",
    "start": "npm run prod",
    "lint": "eslint --ext .js,.vue src",
    "build": "node build/build.js"
  },
  "dependencies": {
    "moment": "^2.20.1",
    "vue": "^2.5.2",
    "vue-router": "^3.0.1",
    "webpack": "^3.6.0"
  }

这就是package.json的外观

部署时,我收到来自Azure的错误。

webpack:not found

错误记录

INFO  - Container logs
Generating app startup command
Found scripts.start in package.json
Running npm start
> myapp@1.0.0 start /home/site/wwwroot
> npm run prod
> myapp@1.0.0 prod /home/site/wwwroot
> webpack --progress --config build/webpack.prod.conf.js
sh: 1: webpack: not found

看起来像缺少网络包。

我是否以正确的方式部署? 如果没有,最新的方法是什么?

1 个答案:

答案 0 :(得分:6)

当您在生产或测试(非开发)上使用Vue.js时,您应该运行build。

npm run build

构建完成后,webpack会将所有文件和文件夹作为应用程序的“可部署”版本提取到根目录中的“dist”文件夹中。

当你在“dist”目录中使用文件时,你不需要任何类型的npm或webpack依赖。

如果您确实需要在Azure服务器上进行webpack或开发,可以尝试全局安装webpack。

npm install webpack@3.6.0 -g