Remove Bootstrap #520

Closed
opened 2025-08-09 17:16:36 +00:00 by fergalmoran · 0 comments
Owner

Originally created by @sylvaincaillot on 8/8/2017

Probably a noob question but I am trying the Vue.js template and I would like to use the Element UI instead of Bootstrap:

I have removed the import line from the boot.ts file:

//import 'bootstrap';
import Vue from 'vue';
import VueRouter from 'vue-router';
import ElementUI  from 'element-ui';
import 'element-ui/lib/theme-default/index.css';

I have uninstalled the bootstrap npm package and clean the package.json file:

{
  "name": "Vue trial",
  "version": "0.0.0",
  "devDependencies": {
    "@types/requirejs": "^2.1.28",
    "aspnet-webpack": "^1.0.27",
    "awesome-typescript-loader": "^3.0.0",    
    "css-loader": "^0.25.0",
    "event-source-polyfill": "^0.0.7",
    "extract-text-webpack-plugin": "^2.0.0-rc",
    "file-loader": "^0.9.0",
    "isomorphic-fetch": "^2.2.1",
    "jquery": "^3.1.1",
    "style-loader": "^0.13.1",
    "typescript": "^2.2.1",
    "url-loader": "^0.5.7",
    "vue": "^2.2.2",
    "vue-class-component": "^5.0.2",
    "vue-loader": "^11.1.4",
    "vue-property-decorator": "^5.0.1",
    "vue-router": "^2.3.0",
    "vue-template-compiler": "^2.2.2",
    "webpack": "^2.2.0",
    "webpack-hot-middleware": "^2.12.2"
  },
  "dependencies": {
    "element-ui": "^1.4.1",
    "moment": "^2.18.1"
  }
}

I have also edited the webpack.config.vendor.js to remove references to bootstrap and bootstrap.css:

entry: {
            vendor: [
                //'bootstrap',
                //'bootstrap/dist/css/bootstrap.css',
                'event-source-polyfill',
                'isomorphic-fetch',
                'jquery',
                'vue',
                'vue-router'
            ],
        },

I have then run webpack --config webpack.config.vendor.js to regenerate the vendor.js.

However, my template is still bootstrapped. What else can I do to get rid of Bootstrap?

Thank you for giving me some directions

Sylvain

*Originally created by @sylvaincaillot on 8/8/2017* Probably a noob question but I am trying the Vue.js template and I would like to use the Element UI instead of Bootstrap: I have removed the import line from the boot.ts file: ``` //import 'bootstrap'; import Vue from 'vue'; import VueRouter from 'vue-router'; import ElementUI from 'element-ui'; import 'element-ui/lib/theme-default/index.css'; ``` I have uninstalled the bootstrap npm package and clean the package.json file: ``` { "name": "Vue trial", "version": "0.0.0", "devDependencies": { "@types/requirejs": "^2.1.28", "aspnet-webpack": "^1.0.27", "awesome-typescript-loader": "^3.0.0", "css-loader": "^0.25.0", "event-source-polyfill": "^0.0.7", "extract-text-webpack-plugin": "^2.0.0-rc", "file-loader": "^0.9.0", "isomorphic-fetch": "^2.2.1", "jquery": "^3.1.1", "style-loader": "^0.13.1", "typescript": "^2.2.1", "url-loader": "^0.5.7", "vue": "^2.2.2", "vue-class-component": "^5.0.2", "vue-loader": "^11.1.4", "vue-property-decorator": "^5.0.1", "vue-router": "^2.3.0", "vue-template-compiler": "^2.2.2", "webpack": "^2.2.0", "webpack-hot-middleware": "^2.12.2" }, "dependencies": { "element-ui": "^1.4.1", "moment": "^2.18.1" } } ``` I have also edited the webpack.config.vendor.js to remove references to bootstrap and bootstrap.css: ``` entry: { vendor: [ //'bootstrap', //'bootstrap/dist/css/bootstrap.css', 'event-source-polyfill', 'isomorphic-fetch', 'jquery', 'vue', 'vue-router' ], }, ``` I have then run `webpack --config webpack.config.vendor.js` to regenerate the vendor.js. However, my template is still bootstrapped. What else can I do to get rid of Bootstrap? Thank you for giving me some directions Sylvain
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github/JavaScriptServices#520
No description provided.