centos系统下的Linux环境,设置vi和vim的行数和代码高亮

一、学习目标

之前好像设置过一次,然后发现又不会了,百度谷歌搜索了下,这次记录下来吧,下次就省时间了。

先看下效果,没有用之前:
在这里插入图片描述
设置行数和高亮之后,注释的代码和没有注释的一目了然,很方便。
在这里插入图片描述

二、设置步骤:

1、vim设置行数和高亮

syntax on # 高亮
set nu # 显示行数

不要带任何#中文,不然报错:

vi /etc/vimrc

# 最后一行加入,不要辅助这行注释

syntax on
set nu

2、vi设置行数和高亮

上面vim设置号之后:

vi /etc/bashrc
# 最后一行加入
alias vi=vim

使用source重新启动/etc/bashrc

source /etc/bashrc

执行完毕之后,vim和vi编辑时就会高亮了,很方便。

已标记关键词 清除标记
相关推荐
<div><p>I am using webpack and tried to include the package but failed with many trails with different combinations. Please help. Appericated.</p> <p>Dick Chan</p> <p><strong>Webpack configuration:</strong></p> <p>var path = require('path') var webpack = require('webpack')</p> <p>module.exports = { entry: './src/main.js', output: { path: path.resolve(__dirname, './dist'), publicPath: '/dist/', filename: 'build.js' }, externals: { "vue-grid-layout" : "VueGridLayout" }, module: { rules: [ { test: /.vue$/, loader: 'vue-loader', options: { loaders: { } // other vue-loader options go here <br /> } }, // { // test: /.css$/, // loader: 'style-loader!css-loader' // }, <br /> { test: /.js$/, loader: 'babel-loader', exclude: /node_modules/ }, { test: /.(png|jpg|gif|svg)$/, loader: 'file-loader', options: { name: '[name].[ext]?[hash]' } } ] }, // plugins: [ // new webpack.ProvidePlugin({ // $: 'vue-grid-layout', // VueGridLayout: 'vue-grid-layout' // }), // ], resolve: { alias: { 'vue$': 'vue/dist/vue.esm.js' } }, devServer: { historyApiFallback: true, noInfo: true }, performance: { hints: false }, devtool: '#eval-source-map' }</p> <p>if (process.env.NODE_ENV === 'production') { module.exports.devtool = '#source-map' // http://vue-loader.vuejs.org/en/workflow/production.html module.exports.plugins = (module.exports.plugins || []).concat([ new webpack.DefinePlugin({ 'process.env': { NODE_ENV: '"production"' } }), new webpack.optimize.UglifyJsPlugin({ sourceMap: true, compress: { warnings: false } }), new webpack.LoaderOptionsPlugin({ minimize: true }) ]) }</p> <p><strong>main.js</strong></p> <p>import Vue from 'vue' import VueMaterial from 'vue-material' // import 'vue-material/dist/vue-material.css' import VueRouter from 'vue-router' import App from './App.vue' import Users from './Users.vue' import Home from './Home.vue' import VueGridLayout from 'vue-grid-layout'</p> <p>Vue.use(VueMaterial) Vue.use(VueRouter) Vue.use(VueGridLayout)</p> <p>const routes = [ { path: '/users', component: Users }, { path: '/', component: Home },</p> <p>]</p> <p>const router = new VueRouter({ routes: routes })</p> <p>Vue.material.registerTheme({ default: { primary: { color: 'light-green', hue: 700 }, accent: 'red' }, blue: { primary: 'blue', accent: 'pink' }, orange: { primary: 'orange', accent: 'purple' }, green: { primary: 'green', accent: 'light-green' } })</p> <p>var testLayout = [ {"x":0,"y":0,"w":2,"h":2,"i":"0"}, {"x":2,"y":0,"w":2,"h":4,"i":"1"}, {"x":4,"y":0,"w":2,"h":5,"i":"2"}, {"x":6,"y":0,"w":2,"h":3,"i":"3"}, {"x":8,"y":0,"w":2,"h":3,"i":"4"}, {"x":10,"y":0,"w":2,"h":3,"i":"5"}, {"x":0,"y":5,"w":2,"h":5,"i":"6"}, {"x":2,"y":5,"w":2,"h":5,"i":"7"}, {"x":4,"y":5,"w":2,"h":5,"i":"8"}, {"x":6,"y":4,"w":2,"h":4,"i":"9"}, {"x":8,"y":4,"w":2,"h":4,"i":"10"}, {"x":10,"y":4,"w":2,"h":4,"i":"11"}, {"x":0,"y":10,"w":2,"h":5,"i":"12"}, {"x":2,"y":10,"w":2,"h":5,"i":"13"}, {"x":4,"y":8,"w":2,"h":4,"i":"14"}, {"x":6,"y":8,"w":2,"h":4,"i":"15"}, {"x":8,"y":10,"w":2,"h":5,"i":"16"}, {"x":10,"y":4,"w":2,"h":2,"i":"17"}, {"x":0,"y":9,"w":2,"h":3,"i":"18"}, {"x":2,"y":6,"w":2,"h":2,"i":"19"} ];</p> <p>Vue.config.debug = true; Vue.config.devtools = true;</p> <p>var GridLayout = VueGridLayout.GridLayout; var GridItem = VueGridLayout.GridItem;</p> <p>new Vue({ el: '#app', components: { GridLayout, GridItem, }, data: { layout: testLayout, draggable: true, resizable: true, index: 0 }, <br /> router, render: h => h(App) })</p> <p><strong>Home.vue</strong> </p><div> <div> <div class="layoutJSON"> Displayed as <code>[x, y, w, h]</code>: <div class="columns"> <div class="layoutItem"> {<!-- -->{item.i}}: [{<!-- -->{item.x}}, {<!-- -->{item.y}}, {<!-- -->{item.w}}, {<!-- -->{item.h}}] </div> </div> </div> </div> <div id="content"> Draggable Resizable <br /> <span class="text">{<!-- -->{item.i}}</span> </div> </div> <p><strong>Error Message</strong></p> <p>3(unknown) [Vue warn]: Property or method "draggable" is not defined on the instance but referenced during render. Make sure to declare reactive data properties in the data option. (found in at /Users/dickhfchan/vue-webpack/vue-routing/src/Home.vue) warn 3(unknown) [Vue warn]: Property or method "resizable" is not defined on the instance but referenced during render. Make sure to declare reactive data properties in the data option. (found in at /Users/dickhfchan/vue-webpack/vue-routing/src/Home.vue) warn (unknown) [Vue warn]: Property or method "layout" is not defined on the instance but referenced during render. Make sure to declare reactive data properties in the data option. (found in at /Users/dickhfchan/vue-webpack/vue-routing/src/Home.vue) warn (unknown) [Vue warn]: Property or method "draggable" is not defined on the instance but referenced during render. Make sure to declare reactive data properties in the data option. (found in at /Users/dickhfchan/vue-webpack/vue-routing/src/Home.vue) warn (unknown) [Vue warn]: Property or method "resizable" is not defined on the instance but referenced during render. Make sure to declare reactive data properties in the data option. (found in at /Users/dickhfchan/vue-webpack/vue-routing/src/Home.vue) warn (unknown) [Vue warn]: Property or method "layout" is not defined on the instance but referenced during render. Make sure to declare reactive data properties in the data option. (found in at /Users/dickhfchan/vue-webpack/vue-routing/src/Home.vue) warn (unknown) [Vue warn]: Unknown custom element: - did you register the component correctly? For recursive components, make sure to provide the "name" option. (found in at /Users/dickhfchan/vue-webpack/vue-routing/src/Home.vue) warn (unknown) You are running Vue in development mode.</p><p>该提问来源于开源项目:jbaysolutions/vue-grid-layout</p></div>
©️2020 CSDN 皮肤主题: 撸撸猫 设计师:C马雯娟 返回首页
实付 9.90元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值