（一）assets文件夾與static文件夾的區別

區別一：assets文件是src下的，所以最后運行時需要進行打包，而static文件不需要打包就直接放在最終的文件中了

區別二：assets中的文件在vue中的template/style下用../這種相對路徑的形式進行引用，在script下必須用@import的方式引入，

? ? ? ? ? ? ? 而static下的文件在.vue中的任何地方都只要使用../這種相對路徑的方式引入，

總結一下

1.assets用來放置樣式、靜態圖片，只要src下面的組件中用到的資源就放在assets中。

2.static用來放沒有npm包的第三方插件，字體文件。

3.assets與components同級 ?components下的.vue引用靜態文件時，相對路徑為 ../assets/wapFront

?

?

4.assets與app.vue同級 ?相對路徑為 ./assets/wapFront

?

?

?

（二）vue如何引入其它靜態文件：

1.src目錄下的資源只能import或require。

2.想靜態引入的話，建立一個與src同級的目錄例如static，然后把靜態資源放入該文件夾下，html的引入路徑如下：./static/...

注：試過一定要放在static文件夾下，否則報錯

?

(三）vue如何引入sass

npm i sass --save-dev 裝下它

npm i sass-loader --save-dev 再裝下它

在webpack.base.config配置文件里加上這段
{
　　test: /\.scss$/,
　　loader: 'style!css!sass'
},
在組件文件.vue里直接引入scss樣式
<style lang="scss">
　　.hello input {
　　color: red;
}
</style>

（四）vue報錯cannot GET
1.你init vue-cli的時候,有個選項問你是否需要eslint可以選擇不需要，因為它是檢驗的，可以不用，如果用它格式寫的不規范啟不來頁面

2.如果已經安裝eslint，將下圖所示部分注釋掉，eslint對空格要求比較嚴格

轉載于:https://www.cnblogs.com/qcl-524077/articles/9233607.html

總結

以上是生活随笔為你收集整理的vue引入静态资源的区别的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。