1. 程式人生 > >vue-cli 使用小技巧

vue-cli 使用小技巧

errors int resolve ror ring 其他 sets icp only

1.關閉煩人的eslint 語法檢測,在 config 文件夾下 設置:

// Use Eslint Loader?
// If true, your code will be linted during bundling and
// linting errors and warnings will be shown in the console.
useEslint: false, //設置為false

2.引入scss樣式文件,在需要引入的組件代碼最後加上:

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang=‘scss‘ scoped>
@import ‘../assets/scss/friend.scss‘; //需要引入的文件


</style>

3.假如你需要在vue中用到其他如jquery的工具或者插件,除了用import方法引入,還可以:

第一步,在入口index.html文件用script標簽引入相應的js文件

第二步,把第一步的文件放入和index,html同級目錄的static文件夾下

4.打包後,輸出的文件dist/static/index.html無法用file協議打開,需要在config文件下index.js配置資源公共路徑

build: {
// Template for index.html
index: path.resolve(__dirname, ‘../dist/index.html‘),

// Paths
assetsRoot: path.resolve(__dirname, ‘../dist‘),
assetsSubDirectory: ‘static‘,
assetsPublicPath: ‘./‘, //改為這個路徑

vue-cli 使用小技巧