标签：scss npm vue cli Vue element VUE router import

1.安装Vue CLI 3

//三选一即可
cnpm install -g @vue/cli

npm install -g @vue/cli

yarn global add @vue/cli

注意：

1.如果安装过旧版的VUE CLI需要先卸载掉

//三选一即可

npm uninstall vue-cli -g 

npm uninstall vue-cli -g 

yarn global remove vue-cli

2.VUE CLI3需要node.js8.9版本及以上 官方链接》》

2.vue create 搭建新项目

vue create <Project Name> //文件名 不支持驼峰（含大写字母）
//如果你在 Windows 上通过 minTTY 使用 Git Bash，交互提示符并不工作，必须通过 winpty vue.cmd create hello-world 启动这个命令

 

 

 选择第一个就好

3.安装scss

npm install -g sass

官方链接》》

4.elementUI

npm i element-ui -S

在 main.js 中写入以下内容：

import Vue from 'vue';
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
import App from './App.vue';

Vue.use(ElementUI);

new Vue({
  el: '#app',
  render: h => h(App)
});

官方链接》》

4.axios

npm install axios

 在 main.js 中写入以下内容：

import axios from 'axios'
Vue.prototype.$http = axios

官方链接》》

5.路由

npm install vue-router

 在 app.vue中写入以下内容：

<router-view></router-view>

 在 main.js 中写入以下内容：

import router from './router.js'

new Vue({
  router,
  render: h => h(App),
}).$mount('#app')

在src文件夹下创建一个router.js中写入以下内容：

import Vue from 'vue'
import Router from 'vue-router'
import HelloWorld from './components/HelloWorld'



Vue.use(Router)

const router = new Router({
    routes: [{
        path: '/',
        redirect: "HelloWorld "
    },
    {
        path: '/HelloWorld',
        component: HelloWorld
    },
    ]
})


export default router

 

标签：scss,npm,vue,cli,Vue,element,VUE,router,import
来源： https://www.cnblogs.com/naitang/p/15723627.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。