福尔摩斯对我笑 2019-05-26 43953 次 13016条



  • 搭建前端工程化
  • 网络优化
  • API定制
  • nodejs层


  • 在命令行中直接使用某个模块的cli模式运行,调用的是该模块全局的版本,所以,一般从package.json文件中启动
  • 新版vue-loader需要安装 VueLoaderPlugin 插件,可查看官网

GIT 提交历史-对应信息


  • loader的处理方式是逐级往上处理,比如:stylus loader 将styl文件转成css-》再通过 css loader|style-loader去处理

webpack-dev-service 的配置和使用

  • 无需建立html文件,可直接通过html-webpack-plugin' 简化html的创建
  • 增加虚拟服务打开html
  • 增加热更新


  • template本质还是render方法



  • 安装Babel-loader时提示 ENOENT: no such file or directory, rename 'F:\webpack打z造todo\node_modules.staging\is-extendable-e20dea61\'

解决方案: 删除package-lock.json文件,重新安装

  • babel-loader

loader 让 webpack 能够去处理那些非 JavaScript 文件(webpack 自身只理解
JavaScript)。loader 可以将所有类型的文件转换为 webpack 能够处理的有效模块,然后你就可以利用 webpack的打包能力,对它们进行处理。

  • babel-loader


  • babel-preset-env


  • 解析jsx文件还需要安装下面的依赖

//npm i babel-preset-env@1.6.1 babel-plugin-transform-vue-jsx@3.5.0
//npm i babel-helper-vue-jsx-merge-props@^2.0.0 babel-plugin-syntax-jsx@^6.8.0


  • findIndex 返回传入一个测试条件或函数中符合条件的数组的第一个元素位置,很类似some


  • 安装 extract-text-webpack-plugin 该插件的主要是为了抽离css样式,防止将样式打包在js中引起页面样式加载错乱的现象
  • 执行后报错: DeprecationWarning: Tapable.plugin is deprecated. Use new API on .hooks instead

    问题原因: extract-text-webpack-plugin目前版本不支持webpack4。
    解决方案: 使用extract-text-webpack-plugin的最新的beta版 npm install extract-text-webpack-plugin@next

  • 打包时报错: Path variable [contentHash:8] not implemented in this context: styles.[contentHash:8].css

    解决方案: 不使用cotentHash,改为chunkHash

webpack区分打包类库代码及hash优化- [利用浏览器的缓存机制,减少服务器压力,合理使用缓存]

  • 使用new webpack.optimize.CommonsChunkPlugin时报错:Error: webpack.optimize.CommonsChunkPlugin has been removed, please use config.optimization.splitChunks instead.


      config.optimization = {
        splitChunks: {
          cacheGroups: {
              commons: {
                  name: "vendor",
                  chunks: "initial",
                  minChunks: 2
  • hash和chunkhash和contenthash的区别

    hash: hash是跟整个项目的构建相关,构建生成的文件hash值都是一样的,所以hash计算是跟整个项目的构建相关,同一次构建过程中生成的hash都是一样的,只要项目里有文件更改,整个项目构建的hash值都会更改。

    chunkhash: 采用hash计算的话,每一次构建后生成的hash值都不一样,即使文件内容压根没有改变。这样子是没办法实现缓存效果,我们需要另一种hash值计算方法,即chunkhash。

    contenthash: contenthash表示由文件内容产生的hash值,内容不同产生的contenthash值也不一样。在项目中,通常做法是把项目中css都抽离出对应的css文件来加以引用。


  • 学习VUE重点不是API和指令,而是过程
  • 眼界放宽,有点耐心,学习过程中确实会有很多报错,一大半的报错是因为版本不同的原因,所以一定要多点耐心,多看看文档
标签: /


未来博客 博主大人



已有 13016 条评论 1

  1. Denis Brudner

    Everything is very open with a precise clarification of the challenges. It was definitely informative. Your website is useful. Many thanks for sharing.

    回复 2019年12月2日
  2. Phil Shoun

    After exploring a few of the blog articles on your web page, I honestly like your technique of writing a blog. I saved it to my bookmark website list and will be checking back soon. Please visit my website as well and tell me how you feel.

    回复 2019年12月2日
  3. balenciaga speed trainer

    I discovered your blog site on google and test a few of your early posts. Continue to keep up the excellent operate. I just additional up your RSS feed to my MSN News Reader. Searching for forward to studying extra from you in a while!?

    回复 2019年11月30日
  4. Tworzenie Stron Internetowych Gorzow

    You are my inspiration , I possess few web logs and often run out from to brand.

    回复 2019年11月30日
  5. Armando Insogna

    I really enjoyed reading, great site, im going to add you to my favorites. eye stye treatment

    回复 2019年11月28日
  6. Ruben Calcagino

    What your stating is absolutely accurate. I know that everyone have to say the identical factor, but I just feel that you put it in a way that absolutely everyone can realize. I also really like the photographs you set in right here. They fit so effectively with what youre hoping to say. Im sure youll achieve so numerous men and women with what youve acquired to say.

    回复 2019年11月28日
  7. chrome hearts online store

    Aw, this was a really nice post. In idea I wish to put in writing like this additionally ?taking time and actual effort to make a very good article?however what can I say?I procrastinate alot and in no way appear to get something done.

    回复 2019年11月28日
  8. converse shoes

    I’m often to blogging and i actually appreciate your content. The article has really peaks my interest. I am going to bookmark your site and preserve checking for new information.

    回复 2019年11月25日
  9. internet

    I just want to tell you that I’m very new to weblog and seriously loved this blog. Very likely I’m planning to bookmark your blog post . You actually come with really good writings. Bless you for revealing your web site.

    回复 2019年11月24日
  10. golden goose sneakers

    There may be noticeably a bundle to know about this. I assume you made sure nice factors in options also.

    回复 2019年11月21日
  11. nike cortez

    An fascinating dialogue is worth comment. I believe that you must write more on this topic, it might not be a taboo subject but typically people are not enough to talk on such topics. To the next. Cheers

    回复 2019年11月18日
  12. jordan 1 off white

    I抎 must verify with you here. Which is not something I usually do! I take pleasure in reading a submit that can make people think. Also, thanks for permitting me to comment!

    回复 2019年11月15日
  13. Fifa Mobile 20 Hack Download 2020

    Fifa Mobile Hack 2020

    Fifa Mobile 20 Hack

    Fifa Mobile Cheats 2020

    Fifa Mobile Mod Apk 2020

    Fifa Mobile Cheat Codes 2020

    Fifa Mobile Cheats No Human Verification 2020

    Fifa Mobile Hack Today 2020

    Fifa Mobile Hack Online 2020

    Fifa Mobile Hack Generator 2020

    Fifa Mobile Hack Without Human Verification 2020

    Fifa Mobile Hack 20

    Fifa Mobile Hack 2020 Without Human Verification 2020

    Fifa Mobile Hack Without Human Verification Android 2020

    Fifa Mobile Hack 2020 Download

    Fifa Mobile 20 Hack Apk 2020

    Fifa Mobile 20 Hack Without Human Verification 2020

    Fifa Mobile 20 Hack No Human Verification 2020

    Fifa Mobile 20 Hack Download 2020

    Fifa Mobile Hack Apk 2020

    Fifa Mobile Cheats Android 2020

    Fifa Mobile Mod Apk Unlimited Money 2020

    Fifa Mobile Mod Apk Unlimited Coins Download 2020

    Fifa Mobile Mod Apk Unlimited Coins Latest Version 2020

    回复 2019年11月7日
  14. StevDede

    Cialis Y Priligy viagra Buy Online Prescription Viagra

    回复 2019年10月26日
  15. Xym


    回复 2019年8月11日