Vue引入本地文件无效
无效的原因是,在webpack打包的设置(/config/index.js
)中,指定将静态资源打包到static
文件夹下,从而导致路径错误。
解决方法:
- 将静态资源放在static文件夹下再引入
– 打包之前
– 打包之后 - 或者在引入时默认静态资源在static文件夹下
我在根目录下建立了css文件夹用来装样式文件
但是在引入的时候,我认为他已经在static文件夹下了(因为运行时它会被安排在那里)
你看,它还在提示,找不到bootstrap.css,因为它现在确实不在static下,但是当运行时(打包后不行,因为webpack会重新组织文件,导致引入失败),它会出现在那里(怎么证明:1.样式生效了 2. 访问http://localhost:8080/static/css/bootstrap.css得到了正确的样式)。
– 打包后,文件被重新组织,已经看不到bootstrap.css了
当然是推荐使用第一种啦,直接将静态文件放在static下,举第二个例子是为了更清楚的理解位置变化