zoukankan      html  css  js  c++  java
  • todo项目总结

    vue+webpack项目工程配置

    1、vue-loader+webpack项目配置

    2、webpack配置项目加载各种静态资源

    3、webpack-dev-server的配置和使用

    安装:

    package.json修改

    webpack.config.js修改

    热加载:

    hot:true

    new  hotreplacementplugin()

    增加一些避免不必要的错误信息显示的插件,不重要

    重新启动:npm run dev

    hot加载方法因为vue-loader里已经提供了。

    但是因为开发使用vue框架和es6的方式,浏览器编译后,代码是编译后的代码,无法看懂,为了方便调试,使用sourcemap将编译后的代码和自己写的代码做出映射,使得在浏览器调试时直接看到自己写的代码。

    sourcemap:

    config.devtool=‘#cheap-module-eval-source-map’

    配置vue的jsx写法以及postcss

    1、配置文件及插件安装

    創建postcss.config.js:

    autoprofixer:自动添加css浏览器前缀

    插件安裝

    .babelrc:用于vue支持jsx

    preset env

    babel-plugin-transform-vue-jsx轉化vue里的jsx的代碼

    在webpack.config.js增加

    {test:‘jsx’,loader:babel-jsx}

    {loader:postcss-loader

    options:{sourceMap:true}}//加快效率

    webpack配置css單獨分離打包:

    plugin:extract-text-webpack-plugin:用於打包非js的內容單獨打包成一個靜態文件

    針對不同環境處理.stylus

    相關插件安裝

    hash和chunkhash的區別

    以上是js里的css分離,下面是vue

    webpack區分打包類庫代碼:

    類庫代碼:vue框架及第三方包

    類庫代碼和業務代碼分離打包:混在一起,每次業務代碼修改,js里的所有代碼也要跟著業務代碼更新而更新,

    區分打包vuek框架代碼:

    修改正式環境里的entry

    增加插件:

    new webpack.optimize.CommonsChunkPlugin({name:'verdor'})

    區分打包webpack代碼:

    new webpack.optimize.CommonsChunkPlugin({name:'runtime'})

    hash和chunkhash的區別:

  • 相关阅读:
    7.内网渗透之windows认证机制
    10.Python之Ansible自动化运维常用模块
    9.python 系统批量运维管理器之Fabric模块
    8.python 系统批量运维管理器之pexpect模块
    7.python实现高效端口扫描器之nmap模块
    6.python探测Web服务质量方法之pycurl模块
    5.python之pip安装模块失败
    4.python 系统批量运维管理器之paramiko模块
    3.python 发送邮件之smtplib模块
    微慕WordPress小程序增强版
  • 原文地址:https://www.cnblogs.com/Zhengxiaoxiao/p/10597162.html
Copyright © 2011-2022 走看看