[TOC] # 使用vue代替 jquery # [Building Mobile Apps With Capacitor And Vue.js](https://www.smashingmagazine.com/2018/07/mobile-apps-capacitor-vue-js/) https://www.jianshu.com/p/b438ed88616f # Vue-Cli3 可以新建個 `vue.config.js` 進行相關 webpack 配置，比如 ```js // vue.config.js module.exports = { //調整 webpack 配置 https://cli.vuejs.org/zh/guide/webpack.html#%E7%AE%80%E5%8D%95%E7%9A%84%E9%85%8D%E7%BD%AE%E6%96%B9%E5%BC%8F configureWebpack: { plugins: [ new MyAwesomeWebpackPlugin() ] }, // webpack配置 // 對內部的 webpack 配置進行更細粒度的修改 https://github.com/neutrinojs/webpack-chain see https://github.com/vuejs/vue-cli/blob/dev/docs/webpack.md // loader chainWebpack: config => { config.module .rule('vue') .use('vue-loader') .loader('vue-loader') .tap(options => { // 修改它的選項...loader return options }) }, // 生產環境關閉map productionSourceMap:false, // baseUrl: './',//vue-cli3.3以下版本使用 // 基本URL publicPath:'./',//vue-cli3.3+新版本使用 // 基本URL outputDir:'dist', // 輸出文件目錄 //放置生成的靜態資源 (js、css、img、fonts) 的 (相對于 outputDir 的) 目錄 assetsDir: 'static', indexPath:'index.html',//指定index.html 路徑 filenameHashing:true,//文件名帶hash // multi-page模式,每個“page”應該有一個對應的 JavaScript 入口文件 pages: { index: { // page 的入口 entry: 'src/index/main.js', // 模板來源 template: 'public/index.html', // 在 dist/index.html 的輸出 filename: 'index.html', // 當使用 title 選項時， // template 中的 title 標簽需要是 <title><%= htmlWebpackPlugin.options.title %></title> title: 'Index Page', // 在這個頁面中包含的塊，默認情況下會包含 // 提取出來的通用 chunk 和 vendor chunk。 chunks: ['chunk-vendors', 'chunk-common', 'index'] }, // 當使用只有入口的字符串格式時， // 模板會被推導為 `public/subpage.html` // 并且如果找不到的話，就回退到 `public/index.html`。 // 輸出文件名會被推導為 `subpage.html`。 subpage: 'src/subpage/main.js' }, //css配置 css: { // 啟用 CSS modules modules: false, // 是否使用css分離插件 extract: true, // 開啟 CSS source maps，一般不建議開啟 sourceMap: false, // css預設器配置項 loaderOptions: { sass: { //設置css中引用文件的路徑，引入通用使用的scss文件（如包含的@mixin） data: ` $baseUrl: "/"; @import '@/assets/scss/\_common.scss'; ` }, css: { // 這里的選項會傳遞給 css-loader }, postcss: { // 這里的選項會傳遞給 postcss-loader } } }, //dev server devServer: { host:127.0.0.1 port:8000, proxy: 'http://localhost:4000', overlay: { warnings: true,//警告 errors: true//錯誤 } } } ``` **其他** 1. 可使用vue serve和vue build 對單個vue文件快速開發 2. vue ui 圖形化界面創建管理項目 [讓vue-cli3.0 配置簡單起來(vue.config.js編結)](https://juejin.im/post/5bd02f98e51d457a944b634f) [Awesome Vue-Cli3 Example](https://github.com/nicejade/awesome-vue-cli3-example) [vue-cli3.0使用及部分配置詳解](https://www.jb51.net/article/146483.htm) [初識babel 7](https://www.jianshu.com/p/0ea6065cb39e) # vue 動畫效果 # 資源 [VUX](https://vux.li/) 移動端 UI 組件庫 [vuemastery](https://www.vuemastery.com/) [vuejsfeed](https://vuejsfeed.com/) # [幾種常用的認證機制](http://www.cnblogs.com/xiekeli/p/5607107.html) HTTP訪問控制（CORS）https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Access_control_CORS # [electron-vue ](https://github.com/SimulatedGREG/electron-vue)