个人简介

Echo Blog


江湖无名 安心练剑
  • Vue Cli-12-构建目标
    构建目标 当你运行 vue-cli-service build 时,你可以通过 –target 选项指定不同的构建目标。 它允许你将相同的源代码根据不同的用例生成不同的构建。 应用 应用模式是默认的模式。 在这个模式中: index.html 会带有注入的资源和 resource hint 第三方库会被分到一个独立包以便更好的缓存 ...
    2018-06-14 07:16:10 | Vue
  • Vue Cli-11-模式与环境 model & env
    模式 模式是 Vue CLI 项目中一个重要的概念。默认情况下,一个 Vue CLI 项目有三个模式: development 模式用于 vue-cli-service serve test 模式用于 vue-cli-service test:unit production 模式用于 vue-cli-service build 和 vue-cli-service test:e2e ...
    2018-06-14 07:16:10 | Vue
  • Vue Cli-10-webpack
    简单的配置方式 调整 webpack 配置最简单的方式就是在 vue.config.js 中的 configureWebpack 选项提供一个对象: // vue.config.js module.exports = { configureWebpack: { plugins: [ new MyAwesomeWebpackPlugin() ] } } ...
    2018-06-14 07:16:10 | Vue
  • Vue Cli-09-CSS
    引用静态资源 所有编译后的 CSS 都会通过 css-loader 来解析其中的 url() 引用,并将这些引用作为模块请求来处理。 这意味着你可以根据本地的文件结构用相对路径来引用静态资源。 另外要注意的是如果你想要引用一个 npm 依赖中的文件,或是想要用 webpack alias,则需要在路径前加上 ~ 的前缀来避免歧义。 更多细节请参考处理静态资源。 预处理器 你可以在...
    2018-06-14 07:16:10 | Vue
  • Vue Cli-08-HTML 和静态资源
    HTML Index 文件 public/index.html 文件是一个会被 html-webpack-plugin 处理的模板。 在构建过程中,资源链接会被自动注入。 另外,Vue CLI 也会自动注入 resource hint (preload/prefetch、manifest 和图标链接 (当用到 PWA 插件时) 以及构建过程中处理的 JavaScript 和 CSS ...
    2018-06-14 07:16:10 | Vue
  • Vue Cli-07-浏览器兼容性
    browserslist 你会发现有 package.json 文件里的 browserslist 字段 (或一个单独的 .browserslistrc 文件),指定了项目的目标浏览器的范围。 这个值会被 @babel/preset-env 和 Autoprefixer 用来确定需要转译的 JavaScript 特性和需要添加的 CSS 浏览器前缀。 现在查阅这里了解如何指定浏览器范围...
    2018-06-14 07:16:10 | Vue
  • Vue Cli-06-vue cli service CLI 服务
    使用命令 在一个 Vue CLI 项目中,@vue/cli-service 安装了一个名为 vue-cli-service 的命令。 你可以在 npm scripts 中以 vue-cli-service、或者从终端中以 ./node_modules/.bin/vue-cli-service 访问这个命令。 这是你使用默认 preset 的项目的 package.json: { ...
    2018-06-14 07:16:10 | Vue
  • Vue Cli-05-plugin 插件和 Preset
    插件 Vue CLI 使用了一套基于插件的架构。 如果你查阅一个新创建项目的 package.json,就会发现依赖都是以 @vue/cli-plugin- 开头的。 插件可以修改 webpack 的内部配置,也可以向 vue-cli-service 注入命令。在项目创建的过程中,绝大部分列出的特性都是通过插件来实现的。 基于插件的架构使得 Vue CLI 灵活且可扩展。如果你对开发...
    2018-06-14 07:16:10 | Vue