VueJS应用程序中缺少静态文件

时间:2019-03-18 15:43:33

标签: javascript vue.js

我的第一个VueJS应用程序结构很简单:

- src/
    - App.vue
    - main.js
    - static/
        - data.json
    - assets/
        - data.json
- .gitignore
- babel.config.js
- package.json
- README.md

babel.config.js看起来像这样:

module.exports = {
    presets: [
        '@vue/app'
    ] 
}

package.json就是这么简单:

{
  "name": "test-app",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "axios": "^0.18.0",
    "vue": "^2.6.9",
    "vuetify": "^1.5.6"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "^3.5.1",
    "@vue/cli-plugin-eslint": "^3.5.1",
    "@vue/cli-service": "^3.5.1",
    "babel-eslint": "^10.0.1",
    "eslint": "^5.15.2",
    "eslint-plugin-vue": "^5.2.2",
    "stylus": "^0.54.5",
    "stylus-loader": "^3.0.2",
    "vue-template-compiler": "^2.6.9"
  },
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/essential",
      "eslint:recommended"
    ],
    "rules": {},
    "parserOptions": {
      "parser": "babel-eslint"
    }
  },
  "postcss": {
    "plugins": {
      "autoprefixer": {}
    }
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not ie <= 8"
  ]
}

最后,我使用以下命令构建应用程序:

$ npm run build

结果,我得到dist文件夹。但是,如我所见,其中没有assetsstatic文件夹。因此,当我转到http://localhost/static/data.jsonhttp://localhost/assets/data.json时,收到以下错误消息:

  

在此服务器上找不到请求的URL /static/data.json。

我该如何解决?

1 个答案:

答案 0 :(得分:2)

可能对您有用吗?将此添加到您的web-pack.production.js

new CopyWebpackPlugin([
      {
        from: path.resolve(__dirname, '../static'),
        to: config.assetsSubDirectory,
        ignore: ['.*'],
      },
    ]),