Question

关于vue-cli构建的项目静态资源引用问题以及用npm run dev启动项目的路径问题，加个问号？

两个问题：

1.用vue-cli构建了项目，然后npm run dev启动，通过localhost:8080/index.html 只能访问到根目录的index.html文件，或者访问localhost:8080/static/logo.png 根目录下static里的文件，那么为什么访问 localhost:8080/src/static/logo.png 就404了，用npm run dev启动的本地服务是有什么默认的限制吗？这个可以改吗？现在我编译完要访问localhost:8080/dist/index.html 都是在根目录再用node启一个8060之类的其他端口，就不能用npm run dev启的服务访问任意文件吗？

2.还有就是在组件里引用静态资源，把资源放在根目录下的static文件夹里就可以正常引用，当放在src/static里就是404了，会报错比如 localhost:8080/src/static/logo.png [404] 我确定这个目录是有这个png文件的。我是这么引用的 .box{background:url(../static/logo.png)} 或者 .box{background:url(/src/static/logo.png)} 搞不懂问题在哪里。

Answer 1

1. 怎么说呢。脚手架生成的都是有配置文件的 比如NPM RUN DEV 执行的是node build/dev-server.js", 这个是在你的Packjson里配置的 就像下面的
   

   "scripts": {
   "dev": "node build/dev-server.js",
   "build": "node build/build.js",
   "unit": "karma start test/unit/karma.conf.js --single-run",
   "e2e": "node test/e2e/runner.js",
   "test": "npm run unit && npm run e2e",
   "lint": "eslint --ext .js,.vue src test/unit/specs test/e2e/specs"
   },

   所以你要在dev-server.js里面去配置你要启动的文件夹

2. 静态资源的目录也是需要配置的 在config/index.js 里面

   assetsSubDirectory: 'static', 这个就是配置了你的静态资源目录

3. 脚手架生成的项目，各个路径还有权限都是配置好的。你需要自己动手去修改，有需要， 去修改配置文件，但是修改有风险，配置需谨慎