vue-cli3,在配置上看似简单但是给后来对开发带来很大对问题,修改起来也相对不容易。
使用yarn或npm都可以安装,我更偏向使用yarn
npm install -g @vue/cli
# OR
yarn global add @vue/cli
在配置中按vue-cli3说明安装配置,和2.0创建项目方式相同
vue create hello-world
1、选择 manually select features,(空格为选取,回撤则提交),选择所需插件,这个确实对没有配置过webpack对人来讲就是坑,会配置webpack对人也不屑用vue-cli,他对初衷是让程序员躲开配置写代码,但是此处已经背弃了。
2、选择所需插件,我选择了babel,router ,vuex,less等必要项。
3、配置axios,可以yarn add axios,也可以直接vue add axios,由vue-cli提供等插件,在页面直接倒入就可以全局使用,
我使用等vue add axios ,发现生成了一个plugins文件夹,源码部分是生成了一个vue组件,并使用了vue.use安装了全局使用及window.axios和Vue.axios全局调用。
(在页面 import './plugins/axios' )
Plugin.install = function(Vue, options) {
Vue.axios = _axios;
window.axios = _axios;
Object.defineProperties(Vue.prototype, {
axios: {
get() {
return _axios;
}
},
$axios: {
get() {
return _axios;
}
},
});
};
Vue.use(Plugin)
安装ant-design-vue,等过程就比较麻烦,使用了 babel-plugin-import 组件部分加载,一直报错,然后百度到原因,因为less 及less-loader版本不一致,冲新安装ant-design-vue框架package.json 中相同版本 yarn add less-loader@^4.0.5 和 yarn add less@^2.7.2
调试通过。