vue create Vue3 on 2020 September + Typescript

Vue 3

woirking on C:\d\lab\flaskw3html\19.vuejs\06.app

reference https://www.jianshu.com/p/e817141b1c8d

vue create vue3

Manual (not vue 2 default or vue 3 default)

On top of default Babel and Linter Formatter, add Router and Vuex

3.x (Preview) not 2.x

History mode n

linter choose Prettier (not error prevention only nor Airbnb nor Standard)

Lint on save (not fix on commit)

dedicated config files (not package.json)

顺便安装bootstra-vue

npm install bootstrap bootstrap-vue

now we can

cd vue3

npm run serve

Optionally modify package.json to add --port 8090 so that

"serve": "vue-cli-service serve -- port 8090",

beside package.json, create "npm.run.serve.bat"

start http://localhost:8090

npm run serve

main.js

import { createApp, Vue } from "vue";

import { BootstrapVue, IconsPlugin } from "bootstrap-vue";

Vue.use(BootstrapVue);

Vue.use(IconsPlugin);

import "bootstrap/dist/css/bootstrap.css";

import "bootstrap-vue/dist/bootstrap-vue.css";

https://stackoverflow.com/questions/63570340/how-to-use-vue-3-add-plugin-boostrap-vue

Bootstrap vue does not support Vue 3 on 2020 September yet

Conclusion:

Only Bootstrap-Vue does not work with Vue3. Others work include:

.env.development
import axios from "axios";
fetch("https://api.coindesk.com/v1/bpi/currentprice.json")
import _ from "lodash";
import Papa from "papaparse";
<script scoped>
import VuexPersist from "vuex-persist";
plugins: [vuexLocal.plugin]

Vuex is 99% the same except

import Vuex from "vuex";
Vue.use(Vuex);
export default new Vuex.Store()

becomes

import { createStore } from "vuex";
export default createStore()

How about Typescript?

vue create vue3

keep default Babel, select TypeScript VueX Router

3.x

No for class-style component syntax

Yes for Babel alongside TypeScript

No for router history mode

最重要的axios原本封装之后不知道如何import去另外一个VueX的index.ts!不能使用

asdsad

End