linux cockpit

linux-cockpit

Screen recording

Project setup

 yarn install

Compiles and hot-reloads for development

 yarn serve

Compiles and minifies for production

 yarn build

Lints and fixes files

 yarn lint

Customize configuration

See Configuration Reference.

項目創建步驟

// 工具nodemon http-server 等可以在測試時候使用yarn global add typescript @vue/cli vue create linux-cockpit // 注意less版本一定是2.xx，不然會報錯，也可以使用3，但是需要配置yarn add [email protected] less-loader node-sass sass-loader electron babel-plugin-import -D //babel-plugin-import 是一個用於按需加載組件代碼和样式的babel 插件yarn add ant-design-vue vue-router vuex ssh2 xterm koa koa-static @koa/router koa-views axios vue-axios @koa/cors@2 xterm-addon-attach xterm-addon-fit xterm-addon-search graphql vue-apollo apollo-boost apollo-server-koa socket.io vue3安裝graphql也可使用vue add apollo

使用vue-cli 3 的小伙伴，修改babel.config.js文件，配置babel-plugin-import

 module . exports = {
  presets : [ "@vue/app" ] ,
+  plugins : [
+    [
+      "import" ,
+      { libraryName : "ant-design-vue" , libraryDirectory : "es" , style : true }
+    ]
+  ]
} ;

package.json中修改vue的配置，將publicPath修改為合適的值，然後添加運行腳本，方便啟動調試

vue.config.js中配置less，以便自定義antdesign主題，和支持less3版本以上module.exports = { css: { loaderOptions: { less: { modifyVars: { 'primary-color': '#1DA57A', 'link-color': '#1DA57A', 'border-radius-base': '2px', }, javascriptEnabled: true } } } }