一、环境

#安装nodejs-官网安装包配置环境变量
node -v #安装webpack
npm install webpack -g #安装vue-cli
npm install vue-cli -g #新建项目
vue init webpack vuedemo #运行项目
npm run dev

npm install报错的

npm cache clean --force

二、生命周期

3、部署

npm run build

生成的dist内容直接以静态文件方式部署到服务器就OK;

build参数根据project.json的配置节点scripts确定;比如:npm run build:prod

通过webpack.DefinePlugin切换环境

new webpack.DefinePlugin({
'process.env': require('../config/xxx.env')
})

分析:

npm run build:prod --report

https://zhuanlan.zhihu.com/p/26710831

https://panjiachen.github.io/vue-element-admin-site/zh/guide/essentials/deploy.html#%E6%9E%84%E5%BB%BA

资源:

npm常用命令

https://www.cnblogs.com/itlkNote/p/6830682.html

常用插件

https://github.com/varHarrie/varharrie.github.io/issues/10

工具配置

{
"breadcrumbs.enabled": true,
"editor.tabSize": ,
"editor.renderWhitespace": "boundary",
"editor.cursorBlinking": "smooth",
"editor.minimap.renderCharacters": false,
"editor.fontFamily": "'Fira Code', 'Droid Sans Mono', 'Courier New', monospace, 'Droid Sans Fallback'",
"editor.fontLigatures": true,
"explorer.confirmDragAndDrop": false,
"extensions.autoUpdate": false,
"files.insertFinalNewline": true,
"git.autofetch": true,
"git.path": "F:\\Program Files\\Git\\cmd\\git.exe",
"search.exclude": {
"**/node_modules": true,
"**/dist": true
},
"typescript.locale": "en",
"window.titleBarStyle": "custom",
"window.title": "${dirty}${activeEditorMedium}${separator}${rootName}",
"window.zoomLevel": ,
"workbench.activityBar.visible": true,
"workbench.colorTheme": "Plastic - deprioritised punctuation",
"workbench.iconTheme": "vscode-great-icons",
"workbench.startupEditor": "newUntitledFile",
"eslint.autoFixOnSave": true,
"eslint.validate": ["javascript", "javascriptreact", "vue"],
"vsicons.projectDetection.autoReload": true,
"vsicons.dontShowNewVersionMessage": true,
"tslint.autoFixOnSave": true,
"debugwrapper.wrappers": {
"default": "console.log('$eSEL', $SEL)"
},
"prettier.tslintIntegration": true,
"cSpell.userWords": [
"Unmount"
],
"jest.autoEnable": false,
}

VSCode

vue:概要的更多相关文章

  1. Vue 2.6版本基础知识概要(一)

    挂载组件 //将 App组件挂载到div#app节点里 new Vue({ render: h => h(App), }).$mount('#app') VueComponent.$mount ...

  2. vue安装概要以及vue测试工具

    一.概述 1.安装node,去node官网 2.新建一个项目,通过npm init命令初始化,即创建一个package.json文件 3.用命令 npm install vue -g 全局安装vue( ...

  3. vue语法概要二

    函数 用途 类别 v-html 用于输出html格式的数据 输出 v-bing 用于输出值 输出 v-model 双向绑定 输入和输出 v-if 逻辑判断 分支语句 v-else 同上 分支语句 v- ...

  4. vue基本语法概要(一)

    先看两种代码,再进行讲解 第一种格式: <template > <div> <div v-for=" item in sites "> < ...

  5. Vue框架基础概要

    Vue.js是什么? Vue.js(读音 /vjuː/,类似于 view 的读音)是一套构建用户界面(user interface)的渐进式框架.与其他重量级框架不同的是,Vue 从根本上采用最小成本 ...

  6. Vue:Promise概要

    1.Promise中then是异步的 2.Promise 的then里面两个回调,默认第一个resolve,第二个reject:不会进入catch:如果只有一个回调则进入catch var p1=ne ...

  7. 前端MVC学习总结(一)——MVC概要与angular概要、模板与数据绑定

    一.前端MVC概要 1.1.库与框架的区别 框架是一个软件的半成品,在全局范围内给了大的约束.库是工具,在单点上给我们提供功能.框架是依赖库的.AngularJS是框架而jQuery则是库. 1.2. ...

  8. Spring MVC 学习总结(一)——MVC概要与环境配置

    一.MVC概要 MVC是模型(Model).视图(View).控制器(Controller)的简写,是一种软件设计规范,用一种将业务逻辑.数据.显示分离的方法组织代码,MVC主要作用是降低了视图与业务 ...

  9. 前端MVC学习笔记(一)——MVC概要与angular概要、模板与数据绑定

    一.前端MVC概要 1.1.库与框架的区别 框架是一个软件的半成品,在全局范围内给了大的约束.库是工具,在单点上给我们提供功能.框架是依赖库的.AngularJS是框架而jQuery则是库. 1.2. ...

随机推荐

  1. python基础学习(十一)

    22.类 # 类 class # 实例 实体 instance class Student: # 空语句 保持结构的完整性 pass jack = Student() jack.name = &quo ...

  2. scrapy框架4——下载中间件的使用

    一.下载中间件 下载中间件是scrapy提供用于用于在爬虫过程中可修改Request和Response,用于扩展scrapy的功能:比如: 可以在请求被Download之前,请求头部加上某些信息(例如 ...

  3. firefox 获取xpath

    在做一个爬虫是,输入内容后,会自动显示内容,而且只能选择,不能根据输入的提交,一点就失去焦点,找不到相关内容 后来发现firefox的查看元素的最左边的类似于鼠标尖头的按钮,就是确保这种情况下,去查找 ...

  4. python正则表达式findall的使用

    文章来源与:http://www.cnblogs.com/zjltt/p/6955965.html 正则表达式 正则表达式本身是一种小型的.高度专业化的编程语言,而在python中,通过内嵌集成re模 ...

  5. django类视图as_view()方法解析

    使用视图函数时,django完成URL解析之后,会直接把request对象以及URL解析器捕获的参数(比如re_path中正则表达捕获的位置参数或关键字参数)丢给视图函数,但是在类视图中,这些参数不能 ...

  6. 怎样获取全局对象 window

    1. 使用window.self window.self === window; // true 2. 使用window.window window.window === window; // tru ...

  7. snort_inline

    snort_inline Link   http://snort-inline.sourceforge.net/oldhome.html What is snort_inline? snort_inl ...

  8. element-ui 文件上传

    <el-form-item> <el-upload ref="upload" class="upload-demo" :action=&quo ...

  9. Java 之 打印流

    打印流 1.概述 平常在控制台打印输出,是调用 print 方法和 println 方法完成的,这两个方法都来自于 java.io.PrintStream 类,该类能够方便地打印各种数据类型的值,是一 ...

  10. English-培训2-五大句型