第十一篇：Vue全局配置自定義css與js

全局配置自定義css與js

配置全局css

首先在src下的assets目錄下創建css文件夾，用於存放css全局文件

1、在創建好的css文件夾下創建global.css文件，內容如下：

html, body {
    margin: 0;
}
 
a {
    color: black;
    text-decoration: none;
}
 
ul {
    margin: 0;
    padding: 0;
}

2、在全局入口文件main.js中導入

//1) 配置全局css
import '@/assets/css/global.css'
// import global_css from '@/assets/css/global.css'  // 資源需要用變量保存,方便以后使用
// require('@/assets/css/global.css')
// let global_css = require('@/assets/css/global.css')  // 資源需要用變量保存,方便以后使用

配置全局自定義js

首先在src下的assets目錄下創建js文件夾，用於存放js全局文件

1、在創建好的js文件夾下創建settings.js文件，內容如下：

export default {
    base_url: 'https://127.0.0.1:8000'
}

2、在全局入口文件main.js文件中配置自定義的js

// 2) 配置自定義js設置文件
import settings from '@/assets/js/settings.js'
Vue.prototype.$settings = settings;
// 在任何一個組件中的邏輯,可以通過 this.$settings訪問settings.js文件的{}數據