本篇是鄙人在vue开发中遇到的小问题
一. 使用sass/scss
1. npm install --save-dev node-sass sass-loader
2. 在build文件夹找到webpack.base.conf.js
3. 添加规则即可,如图
二. 关于axios + vue2.0 在ajax回调中,this指向问题
方法:
箭头函数三 . 在vue 中引入第三方非模块化组件(以zepto为例)
需要借助两个 loader: script-loader 和 exports-loader。
script-loader可以在我们import/require模块时,在全局上下文环境中运行一遍模块 JS 文件(不管require几次,模块仅运行一次)。
exports-loader 可以导出我们指定的对象,作用就是在模块闭包最后加一句module.exports = window.Zepto来导出我们需要的对象,这样我们就可以愉快地import $ from 'zepto'了。
然后修改webpack.base.conf.js 和 xxx.vue文件使用方法
zepto-webpack-config四. npm run dev 编译时报错 “ Couldn't find preset "es2015" relative to directory ”
1. npm install babel-preset-env --save-dev (已废弃:babel-preset-es2015、babel-preset-es2016、babel-preset-es2017 及 babel-preset-latest)
2. 在package.json中添加
或者 在根目录下新建文件 .babelrc
五. mapState、mapMutations、mapActions使用对象展开运算符(...)报错问题
报错如图
解决办法: (babel官网文档链接 )
1. npm install --save-dev babel-plugin-transform-object-rest-spread
2. 文件 .babelrc 添加 "plugins":["transform-object-rest-spread"]
若在package.json中有 babel 参数, 同样是写 "plugins":["transform-object-rest-spread"]
.babelrc六. npm run dev 报错 “No PostCSS Config found in ...“ (webpack 3.0+)
解决: 在根目录创建 postcss.config.js 文件,添加如下代码:(即引入autoprefixer插件)