DUMP101 企业级电商FE

时间：2018-06-29 20:37:07 阅读：110 评论：0 收藏：0 [点我收藏+]

标签：自带注意 ports 价值 you pac dex 使用 span

需求拆分原则

1. 单个迭代不能太大

2. 需求可交付，功能闭环

3. 成本意识二八法则

4. 预期价值体现

……………………………………………………………………………… 做

【直接 git clone】or【重新初始化】

cd <your-path>

git init

git remote add origin <url>

git pull origin master

git add .

git commit -am ""

git push

<要求设置一个上游分支>

【vim .gitignore】push之

git checkout -b <branchname_v1.0.0>

【structure】

$ ls
image/ page/ service/ util/ view/

【npm init】

【webpack】commonjs 过来的，前进是 ES6 。(进一步说明 loader是webpack核心)

npm install -g webpack@1.15.0 ，可以省略版本安装最新但最新的命令要安装 webpack-cli

npm install webpack@1.15.0 --save-dev

【webpack <entry> <output> 演示目的】or 【webpack.config.js】

【自带 loader 机制】

var config =  {
    entry: {
        index: [‘./src/page/index/index.js‘],
        login: [‘./src/page/login/index.js‘],
    },
    output: {
        path: ‘./dist/‘,
        filename: ‘js/[name].js‘,
    }
};

module.exports = config;

【加载 window全局对象下 jQuery】

var config = {
    entry: {
        index: [‘./src/page/index/index.js‘],
        login: [‘./src/page/login/index.js‘],
    },
    output: {
        path: ‘./dist/‘,
        filename: ‘js/[name].js‘,
    },
    externals: {
        jquery: ‘window.jQuery‘
    }
};

module.exports = config;

【使用 commonchunk plugin抽取公共模块】https://webpack.js.org/plugins/commons-chunk-plugin/#src/components/Sidebar/Sidebar.jsx

1. 注意 common 是一个公共全局模块

var webpack = require(‘webpack‘);
var config = {
    entry: {
        common: [‘./src/page/common/index.js‘],
        index: [‘./src/page/index/index.js‘],
        login: [‘./src/page/login/index.js‘],
    },
    output: {
        path: ‘./dist/‘,
        filename: ‘js/[name].js‘,
    },
    externals: {
        jquery: ‘window.jQuery‘
    },
    plugins: [
        new webpack.optimize.CommonsChunkPlugin({
            name: ‘common‘,
            filename: "js/base.js"
        })
    ]
};

module.exports = config;

【加载 css 的 loader】or 【单独打包 plugin + loader】

注意 ExtractTextPlugin + module loader配置

var ExtractTextPlugin   = require("extract-text-webpack-plugin");
var webpack             = require(‘webpack‘);

var config = {
    entry: {
        common: [‘./src/page/common/index.js‘],
        index: [‘./src/page/index/index.js‘],
        login: [‘./src/page/login/index.js‘],
    },
    output: {
        path: ‘./dist/‘,
        filename: ‘js/[name].js‘,
    },
    externals: {
        jquery: ‘window.jQuery‘
    },
    module:{
        loaders: [
            { test: /\.css$/, loader: ExtractTextPlugin.extract("style-loader", "css-loader") }
          ]
    },
    plugins: [
        new webpack.optimize.CommonsChunkPlugin({
            name: ‘common‘,
            filename: "js/base.js"
        }),
        new ExtractTextPlugin("css/[name].css")
    ]
};

module.exports = config;

……………………………………………………………………………………………………想

DUMP101 企业级电商FE

标签：自带注意 ports 价值 you pac dex 使用 span

原文地址：https://www.cnblogs.com/chenhui7373/p/9241207.html

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)

周排行